Question

我看过帖子How to update (append to) an href in jquery?，但似乎答案对我的情况没有帮助。

我目前正在使用插件（easytab）创建一些不同的标签，每个标签都包含<a id="tabopen" href="www.text.com/custom/questions/ask/">

等标签

<a id="tabopen" href="www.text.com/default/questions/ask/">

由于某种原因，我有一个按钮，为所有href附加一些额外的路径，以便将用户重定向到正确的位置。

我尝试过使用

$("a#tab1").each(function() {
   var _href = $(this).attr("href"); 
   $(this).attr("href", _href + 'startDate=20160121?endDate=20160212');
});

但是附加'startDate=20160121?endDate=20160212'它会将所有内容替换为www.text.com/custom/questions/ask/startDate=20160121?endDate=20160212，这是不对的，我该如何解决？

更新1： 对不起，我提供了错误的描述，插件中的ID实际上是相同的。

<a id="tabopen" href="www.text.com/custom/questions/ask/">

<a id="tabopen" href="www.text.com/default/questions/ask/">

Answer 1

$("a#tab1")选择ID为<a>的单 tab1元素。要更改单个元素的href属性，不需要each。

var href = $('a#tab1').attr('href') + '?startDate=20160121&endDate=20160212';
$('a#tab1').attr('href', href);

如果多个元素具有相同的ID， ID应该是唯一的。

要选择ID以tab开头的所有元素，您可以使用attribute start with selector。我建议在它们上面使用一个独特的类。

可以使用具有回调函数的所有匹配元素.attr(attributeName, function)的href属性值。

$('a[id^="tab"]').attr('href', function(i, oldHref) {
    return oldHref + '?startDate=20160121&endDate=20160212';
});

正如@charlietfl中的comment所述，查询字符串格式应如下所示

'?startDate=20160121&endDate=20160212'
 ^                  ^

<强>更新

再说一遍， ID应该是唯一的。，您可以将类而不是ID用于类似用途的元素。

更改标记以使用类

<a class="tabopen" href="www.text.com/custom/questions/ask/">

<a class="tabopen" href="www.text.com/default/questions/ask/">

然后使用选择器

$('.tabopen').something...

不良行为：

如果您无法更改标记（某些插件自动生成标记），则可以使用属性值选择器选择具有相同ID的所有元素

$('a[id="tabopen"]').something...