单击<span>标记以运行JQuery javascript函数[重复] - javascript

This question already has answers here:

Event binding on dynamically created elements?

（23个答案）

2年前关闭。

我使用PHP这样创建跨度。

if ($subnetkey  == 1 ) { echo ("<span class='subnetkey'>S/N of: $subnetnum</span>&nbsp;&nbsp;");}

它可以工作，并在屏幕上显示正确的数据。另外，如果我使用“检查元素”查看它的格式正确，

<span class="subnetkey">S/N of: 780</span>

我在页面顶部有此脚本。我也在底部尝试过。

<script>    
$(document).ready(function(){
    $(".subnetkey").click(function() {
        alert("subnet click mode");
    });
});
</script>

当我单击范围时，什么也没有发生。我没有任何错误，当然我也看不到警报触发。

似乎这是动态构建页面和使用页面之间的时间问题。但是，如果不是这样，我该怎么做才能使函数触发？

javascript参考方案

诸如click（），dblclick（），mouseenter（）等JQuery事件方法仅适用于在渲染DOM时已经创建的元素。对于动态创建的元素，可以使用具有以下语法的on（）方法（请参见previous post）：

$(staticAncestors).on(eventName, dynamicChild, function() {});

由于它是动态创建的元素，因此您的代码将无法工作。尝试：

$(document).on('click', '.subnetkey', function() {
    alert("subnet click mode");
});

jQuery仅在运行时知道页面中的元素，因此jQuery无法识别添加到DOM中的新元素。为了解决此问题，请使用event delegation，将事件从新添加的项目冒泡到DOM在jQuery在页面加载时出现的位置。许多人将document用作捕获冒泡事件的地方，但是不必一直走到DOM树上。理想情况下you should delegate to the nearest parent existing at the time of page load.

提交前用jquery / ajax替换/编码<和> - javascript

我有以下代码，这是页面中评论表单的一部分。 $.ajax({ type: "POST", url: "path/to/script.php", data: $(form).serialize(), success: function(data) { $('#comment_form').fadeOu…

淘汰赛在金字塔中的行为不正确 - javascript

我正在使用Pyramid构建一个Webapp，但是Knockout的行为有所不同。我有一个表格： <div data-bind="with: $root.itemToAdd" style="display: none;"> <form data-bind="submit: $root.add…

剃刀付款集成->如何通过关闭按钮X检测剃刀付款模型是否关闭 - javascript

当用户关闭而无需付款时，我在CI框架中使用Razorpay，请创建razor支付模型，然后取消订单，我希望按状态更改为已取消的状态触发查询。所以我怎么能检测到这一点。我已经通过单击jQuery单击关闭功能但无法使用... javascript大神给出的解决方案 Razorpay提供了JS方法来检测模式关闭。您编写的任何JS代码都不会在结帐页面上运行，因为它是…

iframe的占位符内容 - javascript

我想在iframe中自动显示数据库中的内容，因为它是创建文档时提交的正文内容。我正在尝试插入JS Php，如下所示：<iframe name="editor" id="editor" class="doc_body" ></iframe></div> <sc…

Javascript无法在Heroku的Django应用中呈现 - javascript

在Heroku上部署了Django应用，在我的主页之后，之后的每个页面都不呈现Amazon S3上托管的Javascript文件，但是在Inspect Element中打开Console时，似乎一切都很好。我的HTML文件的标题如下#questions.html <link rel="stylesheet" type="t…