javascript - 在 sumbit 表单之前将文本添加到参数

Question

我有这样的表格

<form action="http://example.com/search" method="get">
    <input type="text" name="q">
    <input type="submit">
</form>

当我用一些文本（例如'AAAAA'）填充参数 q 并提交此表单时，URL 变为http://example.com/search?q=AAAAA。

但是，我想在提交之前将一些文本与其他文本一起添加到参数 q 中。例如，如果用户输入“AAAAA”，则参数变为“AAAAA BBBBB CCCCC”。所以网址变成了http://example.com/search?q=AAAAA+BBBBB+CCCCC。

Answer 1

提交前使用 JavaScript 修改值。向表单添加一个 onsubmit 事件，当您提交按钮时该事件将被触发。像这样...

<form action="http://example.com/search" method="get" onsubmit="return addText();">
    <input type="text" name="q" id="q">
    <input type="submit">
</form>

<script>
function addText(){
    document.getElementById("q").value += " BBBB CCCC"; // Whatever your value is
    return true;
}
</script>

Answer 2

在 jsFiddle http://jsfiddle.net/ilya_kolodnik/N9gWm/上观看我的示例

var text_to_append = "test";
$('form').submit(function(obj) {
    obj.preventDefault();
    alert($("input[name='q']").val());
    $("input[name='q']").val($("input[name='q']").val() + text_to_append);
    this.submit();
});

首先，我们处理表单上的“提交”操作。为了防止表单提交，我们使用 preventDefault(); 然后我们修改查询并提交表单。