Event.prevent(）默认 ajax 不将数据从表单发送到 php

我已经检查了这个答案，但都是不同的问题，只是同一个标题（以防止随机重复标记）。这是对单击过滤器按钮的 ajax 调用，该按钮应将表单中插入的数据发送到 php 文件 formfilt.php并应将结果加载到div 中，并带有 id resultins

<script>
  $(function () {
    $('#filter').on('click', function(event){
        event.preventDefault();
        $.ajax({
            type: 'post',
            url: 'formfilt.php',
            data: $('#formmatcat').serialize(),
            success: function () {        
                $("#resultins").load('formfilt.php');
            }
      });
    });
  });
</script>

我将preventdefault设置为仅在div 中加载而不重定向到 php 文件，这有效，但如果我放置preventDefault它会通过将表单发送的值与那些空值连接起来来回显我构建的字符串。奇怪的是，如果我删除preventDefault当然它会重定向并加载 php 文件，但具有正确的值：

故事的寓意是，带有 ajax 调用的形式中的数据可以正确进入 php 文件，但看起来像 preventDefault 不要让这种情况。提前致谢

这是带有表单的 html 部分的结构

<form id="formmatcat" method="post" action="formfilt.php">  
.
.
various textboxes
.
.
</form>

您正在做的是向formfilt.php发送AJAX请求，当此调用发生并返回响应时，它将作为参数存储在success或$.done函数中，正如我稍后将提到的，这就是您的echo内容所在的地方。

您在这里所做的是，当调用成功时，您只需将GET请求发送到同一页面即可。由于该GET请求与 AJAX POST请求不同，并且没有POST参数，因此不会获得正确的输出。

通过简单地提交表单并让它转到页面而不是取消请求，您将获得正确的值，因为您直接发布到具有正确值的页面，当您调用 load 函数时，您正在执行单独的 AJAX get 请求。

load实际上是什么，是$.get的粗略等价物，这是$.ajax的简写。

查看 jQuery AJAX 文档

jqXHR.done（function（ data， textStatus， jqXHR ） {}）; 作为成功回调选项的另一种构造，.done（）方法取代了已弃用的 jqXHR.success（）方法。有关实现详细信息，请参阅 deferred.done（）。

基本上，$.ajax()调用返回一个 promise 对象，您可以在完成后链接回调。另请注意，这里data将是PHP文件中的实际内容，因此，如果您像这样重写AJAX调用：

<script type="text/javascript">
    $(function() {
        $('#filter').on('click', function(e) {
            e.preventDefault();
            $.ajax({
                type: 'post',
                url: 'formfilt.php',
                data: $('#formmatcat').serialize()
            }).done(function(data) {
                $('#resultins').html(data);
            });
        });
    });
</script>

然后，它将继续将 formfilt.php 的输出加载到 ID 为 resultins 的div 中。

不使用

表单，使用没有表单的输入，并使用按钮标签使用onclick运行函数，如果使用表单，它将提交并重定向，我不擅长jQuery上的ajax但如果我要使用JavaScript/XHR

var CB=document.getElementById("filter").value; //get input/filter value
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200)
        document.getElementById('contain').innerHTML=xhttp.responseText;
  };
var url="formfilt.php?filter="+CB;
xhttp.open("GET", url, true);
xhttp.send();

如果要使用帖子：

xhttp.open("POST", "formfilt.php", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send('filter='+CB);

对不起，我也在学习，而且是新手，一周前才学，

Event.prevent(） 默认 ajax 不将数据从表单发送到 php

Event.prevent() default ajax not sending data from form to php