Question

早上的人。如何使我的javascript或jquery在动态生成的内容中工作。

基本上，我创建了基于用户点击导航菜单的内容生成内容的网页。

我面临的问题：

当主页面从内容页面生成内容时，jquery或javascript将无效。
但是当我单独打开内容页面时，一切正常。

通过搜索收集的信息：

jQuery.load（）方法忽略与动态生成的内容一起提供的脚本标记。

所以我尝试以下方法：

将我需要的标记放在主页面中，而不是放在内容页面中。它不起作用。好像jquery找不到内容元素，因为它们是动态生成的。
由于jQuery.load（）忽略了脚本标记，我尝试了纯粹的javascript ajax，就像w3schools.com教导的那样，xmlhttp方式来生成内容。它不起作用。
单击按钮时。控制台没有响应。

示例 contact.php

<script type="text/javascript">
$(function() {
    $("#submitUser").click(function(e) {
    var fname = $("#fname").val();
    $("#theresult").text(fname);
    e.preventDefault();
});
});
<form id="contactForm"> 
<label for='fname' >First Name</label><br/>
<input id="fname" type="text" name="fname" maxlength="100" />
</form>
<div id="theresult"></div>

当此contact.php动态生成到其他页面时，它不起作用。当我单击“提交”按钮时，控制台显示无响应。好像jquery不存在。
但是当我在浏览器中单独打开它时，它可以工作。

Answer 1

对于动态生成的元素，您应该委派事件，您可以使用on方法：

$(function() {
    $(document).on('click', '#submitUser', function(e) {
       var fname = $("#fname").val();
       $("#theresult").text(fname);
       e.preventDefault();
    });
});

live()方法为deprecated。

Answer 2

在黑暗中采取狂野的刺，因为你的问题没有得到很好的描述，但也许你正在尝试使用.click()等来将事件绑定到动态加载到网页？

如果是这样，您可能希望改为.on()。

Answer 3

您需要使用直播活动。

例如，如果您生成的内容包含点击事件，则可以执行以下操作：

$(".something").live("click", function({ 
// do something
)};

Answer 4

对于动态生成的字段，使用.on（）JQuery方法：

$(document).on('click', '#MyID', function(e) {
    e.preventDefault(); // or you can use "return false;"
});

javascript或jQuery在动态生成的内容中不起作用

4 个答案: