javascript - 在 window.open 函数中添加 URL 前缀 jQuery

Question

我有这个 HTML:

<a href="#" onclick="window.open('TrackPackage.asp?ID=4', '', 'settings');">Track Your Package »</a>

此站点上的某人能够为我提供一个脚本，在 URL 中添加域 http://www.example.com/ 前缀。这是脚本:

$(document).ready(function(){
$('a[onclick^="window.open(\'TrackPackage.asp"]').attr('onClick', $('a[onclick^="window.open(\'TrackPackage.asp"]').attr('onClick').replace("window.open('", "window.open('http://www.example.com/"));
});

但是，我遇到了一些麻烦:
第一个问题是元素有多个实例。这是一个 fiddle :http://jsfiddle.net/VMmZx/
而不是用 ID=4 签署一个 anchor 另一个是 ID=5正如预期的那样，它们都被签署为 ID=4 。
这个想法是，每个 window.open函数应以 http://www.example.com 为前缀但是，URL 的其余部分应保持不变...

我遇到的第二个问题是当页面上不存在该元素时，jQuery 的其余部分将失败......
这是另一个 fiddle :http://jsfiddle.net/VPf32/
<a>应该得到类(class) foo ，但由于页面上不存在该元素，因此 jQuery 不会执行。
由于 JavaScript 包含在 ASP.NET 服务器的 HTML 模板中，因此这可能会产生许多问题。

我希望我已经说清楚了，你可以帮助我。 谢谢。

Answer 1

您可以使用.each()迭代每个匹配元素并单独更改它们:

$('a[onclick^="window.open(\'TrackPackage.asp"]').each(function(index, element) {
    element = $(element);
    element.attr('onclick', element.attr('onclick').replace(/open\('/, 'open(\'http://www.example.com/'));
});​

但是，我不认为使用 href 为 # 和 onclick 打开窗口的链接具有尽可能多的语义是。如果可能，请尝试将标记更改为:

<a href="TrackPackage.asp?ID=4" target="_blank">Track Your Package »</a>

现在，如果有人好奇它将引导他们走向何方，当您将鼠标悬停在浏览器上时，浏览器可以在状态栏中显示有用的内容。

如果您需要进一步调整行为，请添加一个类并绑定(bind)click 事件。当它们单击时，阻止默认操作并自行打开窗口，就像您之前所做的那样。