0

我是 jQuery 新手，我编写了这段代码，在其中开发了一个带有一些输入按钮的表单。有一个“取消”按钮，单击该按钮时，我希望删除表单。

这是我的代码：

$(document).ready(function(){
$(".newIdea_Button").click(function(){

    if (!new_idea_clicked)
    {
    $(document.body).append("<form>...some buttons here, one with the id cancel_idea_input</form>")
    }

});

$("#cancel_idea_input").click(function(){
    $('#new_idea_form').remove();

});


});

事情是一切对我来说似乎都是正确的，但是当我在浏览器（谷歌浏览器或火狐）中打开代码时，当我点击“取消”按钮时没有任何反应。但是当我在谷歌浏览器的控制台部分复制并粘贴第二个函数时，“取消”按钮就起作用了！有人可以帮我弄清楚我的代码有什么问题吗？

4

3 回答 3

2

我猜这个#cancel_idea_input按钮是你表单的一部分。

因此，为了使绑定对动态添加的元素起作用，您应该这样做：

$(document.body).on('click', "#cancel_idea_input", function(){
    $('#new_idea_form').remove();
});

document.bod您可以使用表单所在的任何元素来代替y。

于 2013-07-22T16:48:46.557 回答
0

就放

$("#cancel_idea_input").click(function(){
    $('#new_idea_form').remove();
});

if在你append形成之后在里面

不要忘记id

演示

于 2013-07-22T16:52:14.340 回答
0

在 jQuery 中有click简写。on('click')

编辑：对动态生成的元素使用 on('click')。假设您有带类的包装器 divouterselector

$('.outerselector').on('click', "#cancel_idea_input", function(){
    $('#new_idea_form').remove();
});

对非动态生成的元素使用 on('click')。

$("#cancel_idea_input").on('click', function(){
    $('#new_idea_form').remove();
});

谢谢 Felix Kling，我学到了一些新东西。感谢您的文档参考。

于 2013-07-22T17:00:07.540 回答