Javascript 选择更改时替换href

我有一个select元素，其选项的值是一些数字（一些id）

因此，当我单击第一个选项时，对于

href

www.random.org?id=21

但如果我点击第二个（或任何一个），我会得到

它附加id。如何在更改时“清除”以前的id，并替换为选定的id？我做错了什么？

这应该行得通

var id;
var original_link = "www.random.org";
$('#select').on('change', function(){
    $('.button').attr('href', original_link);
    id = $(this).val();
    var new_href = $('.button').attr('href') + '?id=' + id;
    $('.button').attr('href', new_href);
});

---

你可以尝试像这个改变按钮链接

<a class="button" href="www.random.org" data-link="www.random.org">Click me!</a>

我认为这对你有帮助

$target = $(".target");

$button = $(".button");

使用jQuery，您可以

$target.attr（'href'，$button.data（'href-url'）+'？id='+id））

您可以将函数作为第二个参数传递给函数，在这里您可以替换

.button

的url，如下所示

$('#select').on('change', function(){
    var id   = $(this).val();

    $('.button').attr('href', function (index, value) {
        // if there is id in url - replace it, else add id to url
        return /\?id=/.test(value) ? value.replace(/id=(\d+)/, 'id=' + id) : (value + '?id=' + id);
    });
});

---

关于所有其他答案，我更喜欢少量代码：

$('#select').on('change', function(){
    $( '.button' ).attr( 'href', $( '.button' ).attr( 'href' ).split( '?id=' )[0] + '?id=' + $( this ).val() );
});

当一个

？id=

存在时，此代码实际上会分割

href

，并且只提供它前面的部分。当没有

？id=

时，您会得到正常的href，然后，您只需将

？id=

和

$（this）.val（）

添加到href。（它已经在我编写的代码中）

就这样。没有RegEx、Wordarounds或超过需要的代码行。

检查此项

---

在锚定标记上具有数据属性。从data-attribute读取URI，而不是从

href

属性读取URI。您可以将原始href保存到一个单独的属性，例如

data href orig=“www.random.org”

，然后像这样设置href

$（'.button'）.attr（'href'，$（'.button'）.data（'href-orig'）+'？id='+id）。请记住，如果没有协议（http | https），它很可能会被视为相对URI，可能无法正常工作。url是从php（wordpress）中提取的，我只是简化了我的问题，以避免包含不必要的解释：）我正在尝试，但现在我的id不起作用。我会看一看，看看这个问题，但这似乎应该是可行的，所以我会在一段时间内接受答案。
<a class="button" href="www.random.org" data-link="www.random.org">Click me!</a>

var id;
$('#select').on('change', function(){
    id = $(this).val();
    var new_href = $('.button').data('link') + '?id=' + id;
    $('.button').attr('href', new_href);
});

$target = $(".target");

$button = $(".button");

$('#select').on('change', function(){
    var id   = $(this).val();

    $('.button').attr('href', function (index, value) {
        // if there is id in url - replace it, else add id to url
        return /\?id=/.test(value) ? value.replace(/id=(\d+)/, 'id=' + id) : (value + '?id=' + id);
    });
});

$('#select').on('change', function(){
    $( '.button' ).attr( 'href', $( '.button' ).attr( 'href' ).split( '?id=' )[0] + '?id=' + $( this ).val() );
});

$('#select').on('change', function() {
    var aLink = $('.button'),
        selVal = $(this).val(),
        staticLink = "www.random.org";
        //alert(selVal)
    $(aLink).attr('href', staticLink + "?id=" + selVal);    
})