有没有人有类似的经历？我想使用 .load("...") 函数将外部文件加载到当前页面。加载后，如何触发点击
中的图片？
脚本
$("#tab-3-list img.coupon_list").on("click", function (e) {}
不起作用。如果我将 list.html 的内容嵌入到当前正文中，上面的脚本就可以运行。
<html lang="en" class="ui-mobile">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css">
</head>
<section id="home" data-role="page">
<article data-role="content">
<div id="home-content"></div>
</article>
<!-- content -->
</section>
<!-- home -->
<script type="text/javascript">
$(document).ready(function() {
$("#home-content").load("list.html");
$("#tab-3-list img.coupon_list").on("click", function (e) {
e.preventDefault();
window.alert(this.id);
});
});
</script>
</body>
</html>
外部文件list.html
<div id="tab-3-list">
<div class="ui-grid-a">
<div class="ui-block-a">
<img id="c01" class="coupon_list" src="/images/coupon/c01.png">
</div>
</div>
<!-- /ui-grid-a -->
</div>
<!-- /tab-3-list -->
最佳答案
尝试使用event-delegation在此上下文中，因为您是在运行时加载 DOM 元素，
$("#home-content").on("click","#tab-3-list img.coupon_list",function (e) {
e.preventDefault();
alert(this.id);
});
关于javascript - 如果选择器是从外部加载的，如何触发点击事件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24220103/