添加单击事件按钮正在工作，但将单击添加到相同的元素不起作用

-1

我添加了单击事件按钮。它工作正常。添加单击事件按钮正在工作，但将单击添加到相同的元素不起作用

$("#button1").click(function(){var elem = $("<p></p>").text("hello").attr("id","created"); 
        $("body").append(elem);}); 
$("#button2").click(function(){ $("#created").hide();});

https://jsfiddle.net/e89uf3wg/5/

但是，增加点击事件，新创建的元素不工作。

$("#button1").click(function(){var elem = $("<p></p>").text("hello").attr("id","created"); 
        $("body").append(elem);}); 
$("#created").click(function(){ $("#created").hide();});

https://jsfiddle.net/e89uf3wg/19/

谁能解释。我期待着。我只创建一个元素，当我点击该元素时，它应该隐藏。而已。这个问题不是关于id和class。只是创建一个元素，并尝试实验我在说什么。我想当我点击创建的段落时，它应该隐藏自己。

来源

2016-08-22 beginner

用'$（“＃button1”）。click'和'$（“＃button2”）。click'你正在添加点击处理程序到你的DOM中已经存在的按钮。所以在执行这两行代码之前，您的HTML包含了很好的DOM元素。现在在第二种情况下'$（“＃button1”）。click'正在创建一个ID为'created'的元素。但事件绑定代码，即$（“＃created”）。click'在加载页面时被执行。因此当时没有id为'created'的元素。所以'$（“＃created”）。click（function（）{$（“＃created”）。hide（）;}）;' – vijayP

您需要将click事件绑定到新创建的元素。那么只有它会起作用。 –

这个问题不是关于id和class的。只是创建一个元素，并尝试实验我在说什么。 – beginner

的created元素是一个新创建的元素，以便在页面加载的时间DOM解析器无法找到元素并绑定click事件是你的第二种情况不起作用的原因。这是解决方案。

$(document).ready(function(){ 
$("#button1").click(function(){ 
var elem = $("<p></p>").text("hello").attr("class","created"); 
       $("body").append(elem); 

       $(".created").bind("click", function() { 
$(".created").hide(); 

}); 
}); 
});

我在这里做的是在创建元素时，我手工将一个单击事件绑定到元素。如果您使用ID创建元素，那么它将仅在第一次使用。第二次，当你点击按钮时，它会创建一个具有相同ID的新元素，代码将无法工作。所以在我的例子中，我使用了类而不是ID。这里是工作副本https://jsfiddle.net/aam0nsc4/

来源

2016-08-22 10:29:18

我认为它会在id上工作，但它不能在id上工作，即使对于单个创建的元素 – beginner

@ user6733315这将在id上工作。你需要在代码中提供id，而不是'.created'给出'＃created' –

对不起，你是对的。我疯了，我删除了这个对不起 – beginner

-1

工作例如：https://jsfiddle.net/e89uf3wg/8/

我改变id到class。使用id您只能创建一个元素。

$("#button1").click(function(){ 
    var elem = $("<p></p>").text("hello").addClass('created'); 
    $("body").append(elem); 
}); 

$(document).on('click', '.created', function() { 
    $(this).hide(); 
});

来源

2016-08-22 09:41:27 ofca

请告诉我们我做错了什么。我充满了罪犯，但我不知道我的罪行。请告诉我们我做错了请。 – beginner

-1

这是正确的行为。在第二个示例中，按钮将在单击button1之前创建，因此当您尝试将单击事件附加到#created时，该按钮不存在。您应该在添加click事件之前创建按钮，或者使用第一个onClick函数添加click事件。

所以，你可以这样做：

$("#button1").click(function(){ 
    var elem = $("<p></p>").text("hello").attr("id","created"); 
    $("body").append(elem); 
    $("#created").click(function(){ $("#created").hide();}); // TODO: Check if not already listening to event 
});

来源

2016-08-22 09:50:03 JaschaL

为什么低调？！ – JaschaL

添加单击事件按钮正在工作，但将单击添加到相同的元素不起作用

回答

相关问题