jquery - 根据文本输入修改表单动作

Question

我想修改元素的 action 属性以包含输入到字段中的任何文本。这是我正在尝试做的一个例子，但不能：

<form action="/search/?searchoption=Audio&s=Blocks--[text input here]" method="post" name="audio-search-form">
    <input name="audiosearch" type="text" size="30" id="audiosearch">
    <input type="submit" name="audio-search-submit" value="Search Audio">
</form>

谢谢

Answer 1

使用可以改变表单动作使用

 // Get input value
 input = $("#textboxId").val()

 // Change form action
 $("#formid").attr("action", "/requiredString/" + input);

Answer 2

var $form = $('form');
$form.attr('action', $form.find('input[type="text"]').val());

或者这个你想走极端......：

$('form').attr('action', function(index, old) {
    return old + $(this).find('#audiosearch').val();
});​

Answer 3

如果您的示例表单就是它的全部内容，为什么不将表单方法设为 GET 请求呢？

<form action="/search/" method="get" name="audio-search-form">
    <input name="searchoption" type="hidden" value="Audio">
    <input name="s" type="text" size="30" id="audiosearch">
    <input type="submit" name="audio-search-submit" value="Search Audio">
</form>

编辑：啊！抱歉，我忽略了Blocks--您要添加的部分。不过，我仍将其留在这里以供参考，因为这可能对您有用。（如果Blocks--总是保持不变，您不妨将其添加为单独的隐藏字段，或者完全放弃它并将其添加到后端。）

编辑2：澄清一下，以下结果搜索网址是否有问题：

/search/?searchoption=Audio&type=Block--&s=whatever+the+search+input

例如，可以通过以下方式实现：

<form action="/search/" method="get" name="audio-search-form">
    <input name="searchoption" type="hidden" value="Audio">
    <input name="type" type="hidden" value="Block--">
    <input name="s" type="text" size="30" id="audiosearch">
    <input type="submit" name="audio-search-submit" value="Search Audio">
</form>

?

Answer 4

var initial = $("form").attr("action");
$("input[name=audiosearch]").bind("keyup",function(){
    $("form").attr("action",initial+$(this).val());
})​