gpt4 book ai didi

javascript - 如果选择器是从外部加载的,如何触发点击事件

转载 作者:塔克拉玛干 更新时间:2023-11-02 23:05:26 27 4
gpt4 key购买 nike

有没有人有类似的经历?我想使用 .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/

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