选择动态创建的元素，并聆听2个或更多事件

在我正在写的代码中，我有一个动态创建的div，其中包含一个输入框和一个按钮。当他们的事件发生时，他们有类似的功能。但有小的差异。例如，如果按钮被点击，找到兄弟姐妹值，这是输入值，并删除div和替换包括一个新的输入一个按钮的股利。但如果用户按回车找到$（this）.val（）并对div执行相同的操作。所以功能是相似的。我想将这些事件处理程序与发生的适当事件组合在一起。选择动态创建的元素，并聆听2个或更多事件

我想要做这样的事情

$("body").on('click keypress' ,'button input', function(e){

我需要的第二个参数中的（），因为按钮和输入动态创建

如果我做了什么样的情况之下我认为，处理程序不会被附加到新创建的元素上。

$(document).ready(function() { 
    var counter = 0 

    function giveNew(el, i) { 
     $(el).remove() 
     $("body").append("<button class='go" + " " + i + "' >Go</button>") 
    } 

    $("body button, body input").on('click keypress', function(e) { 
     counter++; 
     var target = $(e.target); 
     if (target.is('button')) { 
      for (var i = 0; i < counter; i++) { 
       giveNew(this, i) 
      } 

      console.log($(this).attr("class")) 
     } else if (target.is('input')) { 
      if (e.which == 13) { 
       alert("input"); 
      } 

     } 
    }) 

});

HTML：

<input class = "input"> <button class="go">Go</button>

来源

2015-07-13 jack blank

添加元素之间用逗号绑定上multiple元素

事件

$("body").on('click keypress' ,'button, input', function(e) {

我建议你到一个类添加到所有的目标元素和使用该类绑定事件。

的Javascript：

$(document.body).on('click keypress', '.myClass', function(e) {

HTML：

<input class ="input myClass" /> 
<button class="go myClass">Go</button>

来源

2015-07-13 06:54:00 Tushar

谢谢您的回答。那个逗号是缺失的部分。我很想知道为什么你会推荐添加这个类。提醒我。我打算在我的代码中添加一个类，如'.input'或'.button'，而不是使用html元素。为什么选择选择类而不是元素更好？ –

@ user2537537因为会有100个“输入”和“按钮”，但只有少数人感兴趣。使用'common class'只会选择兴趣元素。另外，'class'选择器比'element'选择器快。 – Tushar

选择动态创建的元素，并聆听2个或更多事件

回答

相关问题