首页 > 解决方案 > jQuery类选择器click()不起作用

问题描述

我正在尝试使用类选择器(“.user”)按钮来运行另一个功能。但是,当我单击按钮时,不会运行任何功能。下面是我正在处理的代码,最底部是类按钮。我只是不知道为什么它不起作用。我知道我的 getNewTweets 函数有效,并且我有另一个可以正常运行的按钮,但是类选择器不起作用。谁能告诉我为什么?

  $(document).ready(function(){
    var $body = $('body');
    var $timeline = $('<div class="timeline"></div>');
    var $btn = $('<input/>').attr({type:'button',name:'getNewTweets',value:'Get New Tweets'})

    $body.html('');
    $timeline.html('');
    $btn.appendTo($body);
    $timeline.appendTo($body);

    var currentIndex = 0; //Current index of tweets shown

    function getNewTweets() {

      var index = streams.home.length - 1 - currentIndex;

      while(index >= 0) {
          var tweet = streams.home[index];
          var $tweet = $('<div class="tweet"></div>');
          var $time = $('<div class="time"></div>');
          var $message = $('<div class="message"></div>')
          var $user = $('<button class=user></button>');
          $time.text(tweet.created_at);
          $user.text('@' + tweet.user);
          $message.text('tweetled: ' + tweet.message);
          $tweet.append($user);
          $message.appendTo($tweet);
          $time.appendTo($tweet);
          $tweet.appendTo($timeline);
          index -= 1;
          currentIndex += 1;
      }
    };

    $btn.click(getNewTweets);

    $(".user").click(getNewTweets);

标签: javascriptjqueryhtml

解决方案


带有类的按钮user是动态添加到 DOM 中的,因此在$(".user").click(getNewTweets);执行时,.user可能不可用,这导致没有附加点击事件侦听器。解决方案是在文档上附加事件侦听器$(document).on('click', '.user', getNewTweets);


推荐阅读