Question

在阅读了我的问题的一堆解决方案后，我找不到答案，所以我做了我的。

当点击按钮时，我正在添加HTML代码：

$(".button").on('click',function(){
    var p = $(this).parent(); 
    var data =  //  HTML CODE
    '<tr>'+
    '<td>&nbsp;</td>'+
    '<td><br /><textarea name="taDescripcion" class="txtArea mark">Write here</textarea></td>'+
    '<td>&nbsp;</td>'+
  '</tr>'+
  '<tr>'+
    '<td>&nbsp;</td>'+
    '<td><br /><input disabled="disabled" class="button" type="button" value="Send" /> |' +
    '<span class="linkUnderL">Cancel</span></td>' +
   ' <td>&nbsp;</td>'+
  '</tr>';
    $(p).append(data);
});

文本区域输入有一个类（txtArea），这个类已经附加了一个事件，在$(document).ready中创建如下：

$(".txtArea").on('keyup','.txtArea',function(){
        if($(this).val() == ""){
            $(".button").attr('disabled',true); 
        }
        else $(".button").attr('disabled',false);   
    });

由于任何原因，文本区域事件不起作用，正确添加类，样式工作正常。我已尝试使用.delegate()并将事件置于$(function(){ ..code.. });内，但无效

我做错了什么？ ...任何帮助都很感激。提前致谢

Answer 1

如果要将事件绑定到动态创建的元素，则需要在原始选择器中指定父级：

$(document).on('keyup','.txtArea',function(){...

这应该将它应用于文档中的所有textarea。

值得指出的是，除非您确实需要将其应用于整个文档的所有文本区域，否则不应将$(document)用作初始选择器，而应将范围/父级缩小为范围/父级。可能。也就是说，如果<div id="parent"中只有textareas要应用此规则，那么你应该写

$('#parent').on('keyup','.txtArea',function(){...

Answer 2

在文档而不是文本区域类上设置on：

$(document).on('keyup','.txtArea',function(){...});

您需要在DOM中已有的事件上设置事件。

Answer 3

我不确定这是否是您的问题，但.on函数需要绑定在pageload上可用的元素上。

简而言之，您需要确保绑定元素来自页面加载。

$("avaliableFromTheStart").on('keyup','.txtArea',function(){

我相信这可能有所帮助。

修改

$(document).on('keyup','.txtArea',function(){...一个坏主意，与使用现在的衰密.live完全相同的原因是.on放在document上意味着当这个元素单击它将必须冒泡所有，直到它找到顶级document。如果你可以避免它，这是一个非常糟糕的主意。

唯一有意义的是，如果你正在构建一个ajax应用程序。

Answer 4

更改$(".txtArea").on('keyup','.txtArea',function(){...});

至$(document).on('keyup','.txtArea',function(){...});

或者，到.txtArea的选择器父级，并正确委托;）

Answer 5

您可能会尝试将事件附加到文档中。

$(document).on('keyup', '.txtArea', function(e) {
        if($(e.target).val() == ""){
            $(".button").attr('disabled',true); 
        }
        else $(".button").attr('disabled',false);   
    });

Answer 6

尝试更改：

$(".txtArea").on('keyup','.txtArea',function(){...});

要：

$(document).on('keyup','.txtArea', function(){...});

Answer 7

您仍然将事件附加到动态元素。

而不是

$(".button").on('click', function(){ });

将事件附加到非动态元素，例如document或元素的更直接父元素（可能是var p = $(this).parent();选择的任何内容）：

$(document).on('click', '.button', function(){ });

Jquery，“on”方法在动态元素中没有正确绑定

7 个答案: