gpt4 book ai didi

javascript - 使用 jQuery 为 div 加载 html 后,现有代码/函数不适用于加载的内容

转载 作者:行者123 更新时间:2023-11-30 09:02:17 24 4
gpt4 key购买 nike

也许你从标题就明白了,但我要说的是:

我有一个文件,从那个文件我从一个 php 文件加载了一些其他数据:

文件 1 html 文件

<html>
<head>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(function() {
$('#content').load('source.php');

$("#link").click(function() {
alert('Message1!');
return false;
});
});
</script>
</head>

<body>
<div id="content"></div>
</body>
</html>

文件源.php

<?php

for($i=1;$i<=10;$i++) {

echo '<a href="#" id="link">Link '.$i.'</a>';

}

?>

从 php 文件加载内容后,现在这段代码

$("#link").click(function() {
alert('Message1!');
return false;
});

不适用于加载的内容(链接)。

我只需要解释一下这个 DOM 是如何工作的,为什么加载的内容不能与事件函数/代码交互?

最佳答案

你应该使用 live()delegate()如果您使用的是 jQuery < 1.7

$("#link").live('click', function() {
alert('Message1!');
return false;
});

$("body").delegate('#link', 'click', function() {
alert('Message1!');
return false;
});

或使用 on()如果你使用的是 jqQuery > 1.7

$("body").on('click', '#link', function() {
alert('Message1!');
return false;
});

处理页面加载后添加的 DOM 对象的事件。

记住 id 在页面上应该是唯一的这很重要。你可以这样做:

<?php

for($i=1;$i<=10;$i++) {

echo '<a href="#" class="addedLinks" id="link'.$i.'">Link '.$i.'</a>';

}

?>

然后使用类a选择器

关于javascript - 使用 jQuery 为 div 加载 html 后,现有代码/函数不适用于加载的内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8294651/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com