全局Javascript链接处理程序
以下是我所拥有的:全局Javascript链接处理程序,javascript,hyperlink,dom-events,event-delegation,Javascript,Hyperlink,Dom Events,Event Delegation,以下是我所拥有的: 一个在单个HTML页面中运行的web应用程序(称之为myapp.req),内容通过AJAX传递 应用程序可以通过一个链接从外部输入,例如myapp.req?id=123,应用程序会打开一个标签,标签上的项目id为123 页面上的内容主要是用户的内容,并且很多时候都有指向myapp.req?id=123 问题是,单击指向myapp.req?id=123的链接会重新加载浏览器,并删除用户已加载的任何内容或状态 我想要的是能够捕捉到目的地为myapp.req?id=123的链接
- 一个在单个HTML页面中运行的web应用程序(称之为
),内容通过AJAX传递myapp.req
- 应用程序可以通过一个链接从外部输入,例如
,应用程序会打开一个标签,标签上的项目id为123myapp.req?id=123
- 页面上的内容主要是用户的内容,并且很多时候都有指向
myapp.req?id=123
- 问题是,单击指向
myapp.req?id=123的链接会重新加载浏览器,并删除用户已加载的任何内容或状态
myapp.req?id=123的链接点击,而不是重新加载页面,只需打开项目123的选项卡,保留当前加载的任何其他内容。但是,如果链接是针对外部网站的,那么很明显,就让浏览器离开
所以我的问题是:我是否可以有一个全局链接处理程序来检查我是否想要处理链接点击,如果是,运行一些Javascript并且不离开
我知道我可以找到所有的
并添加监听器,但我希望解决方案只需要设置监听器一次,而不是每次在页面上加载新内容时都添加链接处理程序。由于内容可以以多种不同的方式加载,因此在所有这些地方添加代码会很麻烦
这有意义吗?更新了使用.live
而不是。单击
如果使用jQuery,可以立即向每个a href
添加一个“实时”单击事件处理程序:
<body>
<a href="app.req?id=123&test=432">click here</a>
<br/>
<a href="http://whatever.com">whatever</a>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
$('a').live('click',function() {
var myID = $(this).attr('href').match(/id=([a-zA-Z0-9_-]*)\&?/)[1];
if (myID) {
//run code here
alert(myID);
return false;
}
});
</script>
$('a').live('click',function()){
var myID=$(this.attr('href').match(/id=([a-zA-Z0-9\-]*)\&?/)[1];
如果(myID){
//在这里运行代码
警报(myID);
返回false;
}
});
这将从href的查询字符串中提取id,并允许您使用它执行任何操作。就是您所需要的:
$('a').live("click", function () {
var myID = $(this).attr('href').match(/id=([a-zA-Z0-9_-]*)\&?/)[1];
if (myID) {
//run code here
alert(myID);
return false;
}
});
现在,无论是否在调用该链接后添加,任何链接都将具有该单击处理程序 当然可以。在主体上添加clickhandler。所以你能抓住所有的点击。然后,您必须检查事件的目标或其父项之一是否是与特定href的链接。在这种情况下,请停止事件并打开选项卡。不幸的是,这正是我试图避免的。您提供的代码只会为页面上当前的每个链接添加侦听器,但是页面的内容会一直更改,并且可以经常呈现新链接。因此,每次呈现新内容时,我都需要运行您的代码。相反,我希望有一个全局侦听器,在浏览器离开页面之前,只要单击任何链接,它就可以运行。使用live,而不是单击。。它应该考虑到任何新的元素进入页面..这是我需要的。谢谢不幸的是,jQuery现在在我的应用程序中不是一个选项,所以我选择了另一个答案作为解决方案。谢谢你的信息!