选择更改后使用jQuery更改href参数答案

【问题标题】：Change href parameter using jQuery after select change选择更改后使用jQuery更改href参数
【发布时间】：2012-09-29 18:27:00
【问题描述】：

我需要使用 jQuery 更改几个 href 参数并由两个表单选择选项驱动。下面的示例完美运行，但由文本输入驱动，并且在将其转换为使用 select 时遇到问题。

https://stackoverflow.com/a/6540265/460322

我知道这不应该太难，但我今天早上感冒了，脑子像糊状一样！

到目前为止我的代码不起作用：

$(window).load(function(){

function updateNameValue() {
    $('#changelink').val($('#option1 option:selected').attr('href', function(i,a){
        return a.replace( /(field16=)[a-z]+/ig, '$1'.target.value ));
    });
});

$('#option1').change(updateNameValue);

updateNameValue();
});

【问题讨论】：

Richard，到目前为止，您并没有真正向我们展示您尝试过的内容 :) 通常您只需对特定的更改对象使用 $.attr("href","newlink") 函数来更改它的 href 属性。
提供一些你尝试过的代码部分。

标签： javascript jquery

【解决方案1】：

我最终使用了以下代码：

function changeHref(){
 arg1 = $('#o1').val();
 arg2 = $('#o2').val();
 if (!arg1)
    arg1 = 'default1';
 if (!arg2)
    arg2 = 'default2';
 link = "link.html?arg1=" + arg1 + "&arg2=" + arg2;
 $('#updateLink').attr("href",link)
}

$('.linkUpdater').change(function(){
 changeHref();  
});

changeHref();

使用此 HTML：

<select class="linkUpdater" id="o1">
    <option value="">Select</option>
    <option value="option1">Option 1</option>
    <option value="option2">Option 2</option>
</select>
<select class="linkUpdater" id="o2">
    <option value="">Select</option>
    <option value="optionA">Option A</option>
    <option value="optionB">Option B</option>
</select>

<a id="updateLink" href="link.html">Link</a>

【讨论】：

【解决方案2】：

编辑：这应该工作 - jsfiddle.net/9dGdC

首先，将select字段中每个option标签的value属性设置为各自的href值，如下图。

<select>
 <option value="www.example.com">Option 1</option>
</select>

然后，使用以下代码：

$('select').change(function(){
 $('.link').attr('href',$(this).val())
});

这会改变链接的 href 属性！

【讨论】：

谢谢，但这不是我想要的。我确实有这个工作，但我实际上需要更改 URL 中的参数：/form/field16=REPLACETHIS&field18=REPLACETHIS
看起来它会起作用。现在将尝试集成并报告 - 谢谢。