javaScript 不适用于由 jquery 加载函数加载的页面

标签 javascript jquery html

第 1 页

<html>
<head>
<script src="jquery-1.8.3.js" type="text/javascript"></script>
</head></head>
<body><div id="main"></div> </body>
<script>$('div[id=main]').load('page2.php')
$('span[id*=temp]').on('click',function(){
alert(this.id); }); //this block of code not working!!
</script>
</html>

第 2 页

<div>
<span id="temp">
this is demo
</span>
</div>

基本上我想在单击标签时在主 div 中再次加载 page2 但我无法在第一页中获取标签的 id,page1 的脚本不适用于第二页的项目或标签

最佳答案

您试图在 AJAX 调用之后立即绑定(bind)事件,因此该元素尚不存在。该调用是异步的,因此不会停止代码执行以等待响应。

要么在内容加载后绑定(bind)元素,使用 load 方法的 success 回调:

$('div#main').load('page2.php', function(){
  $('span[id*=temp]').on('click', function(){
    alert(this.id);
  });
});

或使用委托(delegate)将事件绑定(bind)到父元素:

$('div#main').load('page2.php');
$('div#main').on('click', 'span[id*=temp]', function(){
  alert(this.id);
});

关于javaScript 不适用于由 jquery 加载函数加载的页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14569572/

相关文章:

java - 使用ajax推送通知

jquery - 使用 jQuery addClass CSS 旋转元素

javascript - 将 JSON 数据传递到 div 框中

javascript - 如何将 javascript 字符串变量保存到文件中

javascript - 将两个字符串组合在一起

javascript - 日期时间选择器将输入元素与它的 css 混淆

javascript - 单击提交按钮时,临时更改 PHP 中同一页面上的 HTML 结构?

javascript 窗口条件不起作用

javascript - 根据调整窗口大小的动态高度 div

javascript - 确保手机方向始终为横向才能查看网站