jquery - 使用 jQuery 动态更改操作值时无法提交表单

Question

我正在使用 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>

Answer 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) 应该存在