javascript - 使用 Jquery 将字段输入值作为查询字符串附加到 url 中

Question

我相信我拥有大部分权利，但可能会弄乱顺序，并且由于某种原因无法保存。基本上，我需要获取表单输入的一部分，并将其作为查询字符串附加到提交上，以便触发下一页上的附属 cookie。所有代码均以 AAA-11 值开头，然后是实际的联属网络营销引用代码。所以

<form>
    <label>Affiliate Code</label>   
    <input type="text" id="code">
    <input type="submit" id="submit_btn">        
</form>

还有 JS:

$('#submit_btn').on('click', function() {
    var str = $('#code').val();
    var acode = str.substr(6);
    location.href = location.href + "?ref=" + acode;
});

我在这里缺少什么？

Answer 1

您的按钮正在提交表单，因为它的属性type="submit"

您可以将该属性更改为 type="button"，或使用 event.preventDefault() 以编程方式阻止表单提交，以便您可以修改数据。

$('#submit_btn').on('click', function(event) {
    event.preventDefault();
    var str = $('#code').val();
    var acode = str.substr(6);
    location.href = location.href + "?ref=" + acode;
});

<小时/>

[编辑](评论)

如果您需要修改表单action并提交表单，请使用:

$('#submit_btn').on('click', function(event) {
    event.preventDefault();
    var str = $('#code').val();
    var acode = str.substr(6);
    // change form action attribute and submit the form:
    $(this).closest('form').attr('action', location.href + "?ref=" + acode).submit();
});