不幸的是,我正在使用一些第三方javascript,它会在我的页面中插入链接。我不想直接使用这些链接,而是使用代理元素,当单击它们时,会触发第三方链接上的click事件。
第三方链接将javascript包装到href属性中,如下所示:
<a id="horribleLink" href="javascript:doSomething()">Click me</a>
我的代理元素如下所示:
<button rel="horribleLink" class="linkProxy">No, click me</button>
还有一些jQuery的javascript将它们链接在一起:
$('button.linkProxy').click(function(){
$('#' + $(this).attr('rel')).click();
});
现在,如果第三方链接是,这将完美地工作 只是一个标准链接(<a id="horribleLink" href="http://www.google.com">Click</a>
), 要么 一点点可怕的onclick(<a href="#" id="horribleLink" onclick="doSomething()">Click</a>
),但是当javascript在href属性中时,触发'click'什么都不做。
谁能告诉我为什么,以及是否有合理的解决方法?
更新 正如Millimetric所说,根本原因似乎是浏览器阻止了对锚点的“伪造点击” - 我删除了我的“标准链接”示例,因为这是另一种无效的情况。但是,正如您所期望的那样,onclick处理程序确实可以正常工作。
这里接受的答案深入探讨了“为什么会这样”: 我是否可以调用jquery click()来跟随<a>链接,如果我还没有使用绑定或单击已绑定事件处理程序?。基本上,似乎你不能在链接上执行click(),因为浏览器不支持虚假点击。
一个解决方法:
如果为这些情况设置location.href,它可以工作:
$('button.linkProxy').click(function(){
location.href = $('#' + $(this).attr('rel')).attr('href');
});
工作小提琴: http://jsfiddle.net/uv29x/3/
两种解决方法:
你可以得到这些链接的href并做一个 eval()
在他们身上,对吗?
组 window.location
到了 href
值。
$('button.linkProxy').click(function(){
window.location = $('#'+$(this).attr('rel')).attr('href');
});
DEMO: http://jsfiddle.net/dmSUm/
当我看到Milimetric的答案时,我刚刚打完这个。这是代码,无论如何它的价值 -
eval($('#horribleLink').attr('href').replace('javascript:',''));
使用原生Javascript click
方法,你有一个工作点击!
$('button.linkProxy').click(function(){
$('#' + $(this).attr('rel')).click()[0].click();
});
我保留了jQuery click
假设 那个Javascript click
将绕过jQuery trigger
在这种情况下你会想要保持两者。否则,如果我错了(或者你不需要考虑 trigger
)你可以把它减少到:
$('button.linkProxy').click(function(){
$('#' + $(this).attr('rel'))[0].click();
});
如果我正确理解了这个问题,问题就是你有这样的事情:
<a href="javascript:alert('hello');" onclick="javascript:alert('clicked');">Test</a>
并且你声称当javascript在href上时,onclick事件不会被触发。正确?如果是这样,我看到的是两个都被解雇,首先是onclick然后是href里面的javascript。