使用jQuery动态更改动作值时无法提交表单答案

【问题标题】：Cannot submit form when dynamically change the action value using jQuery使用jQuery动态更改动作值时无法提交表单
【发布时间】：2015-01-03 20:25:30
【问题描述】：

我正在使用 Bootstrap 进行设计和表单验证。

我在使用 JavaScript/jQuery 动态更改表单操作时遇到了问题。提交按钮后，没有任何反应，提交按钮被禁用。

这是我的 jQuery 代码：

$('.btnSaveQuery').on('click', function(){
        $('#formId').attr('action', 'saveQuery').submit();
});

这是我的 HTML 表单代码：

<form id="formId" method="POST" class="form-horizontal">
    <div class="form-group">
        <div class="col-sm-4">
            <input name="name" class="form-control" placeholder="name" />
        </div>
        <div class="col-sm-4">
            <input name="description" class='form-control'
                placeholder="description" required autofocus />
        </div>
    </div>

    <div class="form-group">
        <div class="col-sm-9 col-sm-offset-3">
            <button type="submit" class="btn btn-success   btnSaveQuery">Save</button>
        </div>
    </div>
</form>

【问题讨论】：

在您的代码中，我没有看到任何 id queryStringWrapper
抱歉，我已经将 id 从 'queryStringWrapper' 更新为 'formId'
这个确切的代码对我有用。我创建了一个 saveQuery.php 文件来测试它，它可以正确接收数据。所以问题一定是你的代码的一部分
你好@Tivie你也在使用bootstrap和jquery吗？
删除输入标签中的“必需的自动对焦”键时，我的代码正在工作。但我需要这些来进行验证。

标签： jquery html twitter-bootstrap validation

【解决方案1】：

多种修复方法。要么不要使用type="submit"，要么不要通过代码提交。默认情况下，表单实际上是在点击时提交的。

你可以这样做

<button class="btn btn-success btnSaveQuery" onclick="submitForm()">Save</button>

<script>
function submitForm()
{
$('#formId').attr('action', 'saveQuery').submit();
}
</script>

或者在提交之前更改操作..例如在页面加载时..

-------------或---------------

我没有测试过，但以下可能对你有用

$(".btnSaveQuery").on('click', function() {
   $('#formId').attr("action", "saveQuery");// do not submit. Its done by default
});

注意：确保 saveQuery(url) 应该存在

【讨论】：

嗨，萨米，我很高兴你回答了我的问题。删除 'submit()' 键可以让我的应用正常工作 :) 非常感谢 :)

【解决方案2】：

请在代码中使用 return false

$(".btnSaveQuery").on('click', function() {
   $('#formId').attr("action", "saveQuery")
});

【讨论】：

嗨@Abhishek Kasera，我尝试了你的建议，但对我不起作用。但是当我删除输入标签中的“必需的自动对焦”键时它工作正常，但我需要这些键进行验证。
不用jQuery.submit()也可以使用