Question

抱歉，我对这个问题感到很疯狂。每次我调用jQuery时都会重新加载我的页面。

HTML文件：

<body>
<form enctype='multipart/form-data' id="form_id">
---- some inputs here ------
<input type='submit' value='Basic search'>
</form>
<script type="text/javascript">
$(document).ready(function() {
    $(document).on('submit', '#form_id', function() {
        var data = $(this).serialize();
        $.ajax({
            type : 'POST',
            url  : 'phpfile.php',
            data : data,
            success :  function(data)
            {$(".result").html(data);} //result is div that i want display result in it

        });
        return false;
    });
});
</script>
</body>

编辑1： 我使用<input type ='button'> <input type = 'submit'> $(document).on('click', '#search_button', function(e) { e.preventDefault();，但它不起作用。我添加

{{1}}

但是，它不起作用！

编辑2： 控制台中的错误消息：表单包含enctype = multipart / form-data，但不包含method = post。正常使用method = GET提交，而不是使用enctype。

表单以windows-1252编码提交，无法编码所有Unicode字符，因此用户输入可能会损坏。要避免此问题，应更改页面，以便通过将页面本身的编码更改为UTF-8或在表单元素上指定accept-charset = utf-8，以UTF-8编码提交表单。

表单包含文件输入，但在表单上缺少method = POST和enctype = multipart / form-data。该文件将不会被发送。

改变对象的[[Prototype]]会导致代码运行得非常慢;而是使用Object.create

创建具有正确的初始[[Prototype]]值的对象

未声明HTML文档的字符编码。如果文档包含US-ASCII范围之外的字符，则文档将在某些浏览器配置中使用乱码文本进行渲染。必须在文档或传输协议中声明页面的字符编码。

主线程上的同步XMLHttpRequest因其对最终用户体验的不利影响而被弃用。如需更多帮助http://xhr.spec.whatwg.org/

此页面上的脚本已禁用Web控制台日志记录API（console.log，console.info，console.warn，console.error）。

Answer 1

我通过用jQuery替换$来解决问题

jQuery.ajax insted of $.ajax

Answer 2

请勿使用<input type='submit'>，因为默认情况下会重新加载页面。请改用<button>。

<button id='search_button'>Basic search</button>

<script type="text/javascript">
$(document).ready(function() {
    $(document).on('click', '#search_button', function() {
        var data = $(this).serialize();
        $.ajax({
            type : 'POST',
            url  : 'phpfile.php',
            data : data,
            success :  function(data)
            {$(".result").html(data);} //result is div that i want display result in it

        });
        return false;
    });
});
</script>

在提交事件上调用jQuery重新加载页面

2 个答案: