Question

我试图通过点击div来实现代码可重用性，它会给出div的numberDiv属性。它适用于第一个具有类divClassSelector的默认div，但我有一些其他的js代码，每当你按下按钮＆＃34; +1 Div＆＃34;时，插入另一个div。然后，当我尝试提醒新创建的div的numberDiv属性时，它不起作用。我假设这是因为首次加载页面时DOM中不存在新创建的div，因此无法找到新的div。我可能错了。

有人知道这个问题的解决方法吗？非常感谢任何帮助。

这是我的代码：

//HTML
...
<body>
    <div class="divClassSelector" numberDiv="1"></div>
    <button id="plusOneDiv">+1 Div</button>
</body>
...

//My JS:

//Code to alert the div's numberDiv attribute value
$(".divClassSelector").on("click", function(){
    var numberDiv = $(this).attr("numberDiv");
    alert(numberDiv);
});

//Code to insert another div
var count = 2;
$("#plusOneDiv").click(function(){
    $(body).append(<div class="divClassSelector" numberDiv="'+count+'">');
    count++;
});

感谢您提前帮助和欢呼！

更新1：

有没有人知道如何点击div，触发由＆＃34;焦点＆＃34;触发的事件。在表单输入字段上，也就是说，当您单击它并与其进行交互时。我尝试使用＆＃34;焦点＆＃34;方法，但它一遍又一遍警告同样的事情，直到我关闭标签，然后我可以逃脱警报无限循环。谢谢！

Answer 1

首先将这个'$'添加到您的代码中： - $（this）.attr（“numberDiv”）; -

$(".divClassSelector").on("click", function(){
var numberDiv = $(this).attr("numberDiv");
alert(numberDiv);
});

同时将点击功能更改为

$(document).on("click",".divClassSelector", function(){
var numberDiv = $(this).attr("numberDiv");
alert(numberDiv);
});

Answer 2

$(document).on('click', '.divClassSelector', function(){
var numberDiv = $(this).attr("numberDiv");
alert(numberDiv);
});

或

$('body').on('click', '.divClassSelector', function () {...})

你忘记了$

var numberDiv = (this).attr("numberDiv");

到

 var numberDiv = $(this).attr("numberDiv");

使用jquery插入动态HTML后，单击时无效

2 个答案: