在不刷新页面的情况下发送表单

Question

我有一个问题，希望你们能帮我解决。

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $("#myform").validate({
        debug: false,
        rules: {

        },
        messages: {

        },
        submitHandler: function(form) {
            $.post('goCarnet.php', $("#myForm").serialize(), function(data) {
                $('#results').show("fast").html(data);
            });
        }
    });
});
</script>

<form method="post" action="" id="myForm" class="form-horizontal">
    <label class="field-label col-md-3 text-left">Nombre de carnets : </label>
    <div class="col-md-9">
        <select name="nbr" id="multiselect1">
            <option value="1" selected>1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
        </select>
        <label>&nbsp; De &nbsp;</label>
        <select name="total" id="multiselect2">
            <option value="25" selected>25</option>
            <option value="50">50</option>
        </select>
        <label>&nbsp; chèques</label>
    </div>
    <div class="text-right">
        <button type="submit" class="btn btn-sm btn-default btn-primary"> Commander </button>
    </div>
</form>
</div>
<div id="results" style="display:none" class="alert alert-success" role="alert"></div>

表单现在刷新了同一个页面，但没有任何结果，我希望它可以粘贴 PHP 文件中的数据。 附注：这个完全相同的代码在另一个项目上运行得很好。

- user1114748

---

http://jsfiddle.net/arunpjohny/bnq6xza6/2/ - 看起来没问题 - 看看会弹出什么 - Arun P Johny

整个页面都运行不了，所以肯定是页面中添加的某些 JS 脚本出了问题吧？ - user1114748

你是否包含了 jQuery 验证插件？ - Arun P Johny

@SharpEdge 1.11.3与2.1.4完全相同，但支持较旧的IE版本。我刚刚查看了jQuery的更改日志，他们说，由于在1.9中进行了重大更改，因此许多插件在之前和之后可能不兼容。 - Rauli Rajande

我也尝试了，但它没有起作用，不过谢谢你的留言。我刚刚也阅读了更新日志 :) - user1114748

Answer 1

我会像这样做，阻止默认行为...

$(document).ready(function() {
    $('#myForm').on('submit', function(event)
    {
        $.post('goCarnet.php', $(this).serialize(), function(data)
        {
            $('#results').show("fast").html(data);
        });
        event.preventDefault();
    });
});

- Mick Redman

Answer 2

将您的<button>类型更改为type="button"

- FosterZ