jquery点击输入[type='']dons'不起作用

jquery click input[type=''] doesn't work

本文关键字：dons 不起作用 输入 type jquery      更新时间：2023-09-26

我在jquery中遇到了.click（）事件问题。我创建了一个带有按钮的输入标记，然后当我单击该标记时，它必须显示一条警告消息。但它不起作用。这是HTML代码：

<div id="test">
</div>
<input type="button" id="btn" value="Submit" />

和Jquery代码：

$("#btn").click(function(){    
    html = "<input type='text' size='1' name='courses[]' value='1' />";
    $("#test").after(html);
});
$("input[type='text']").on("click", function(){             
    alert('ppp');
});

jquery的所有库都链接在真实的站点中。以下是jsFiddle中的一个示例：http://jsfiddle.net/82pps6Lz/29/感谢

想想看，只有在单击按钮时才插入一个新的<input>元素，但当<input>元素还不存在时，您会立即绑定一个click事件。因此，您应该在元素插入之后（或插入期间）绑定事件：

$('#btn').click(function(){    
    var html = "<input type='text' size='1' name='courses[]' value='1' />";
    $(html).on('click', function() {
        // ...
    }).insertAfter('#test');
});

或者使用DOM事件委派：

$('#btn').click(function(){    
    var html = "<input type='text' size='1' name='courses[]' value='1' />";
    $('#test').after(html);
});
$(document).on('click', 'input[type="text"]' function() {             
    // ...
});

使用此：

$(document).on("click","input[type='text']", function(){             
    alert('ppp');
});

以上是如何使用事件委派。也可以在<input>存在后进行绑定。

演示

插入后需要绑定输入。因为当执行$("input[type='text']")时，input不存在。它一直存在，直到您单击submit。

      $("#btn").click(function(){    
           html = "<input type='text' size='1' name='courses[]' value='1' />";
           $("#test").after(html);
           $("input[type='text']").on("click", function(){             
                 alert('ppp');
           });
       });
相关文章：