Question

我想使用jQuery $ .ajax GET方法处理表单，并且查询参数最终会在url中。如果我在没有jquery的情况下处理表单，我可以完成这个，但如果我通过jQuery的$ .ajax方法执行它，我必须使用event.preventDefault（）阻止浏览器的默认操作，在这种情况下，参数永远不会在URL中结束。基本上，我想要做的是提交/处理表格，如果有人从网址输入查询（即mysite.com?param1=myValue）或者他们点击提交按钮。

<form id='myForm' action="" method="get">
    Username: <input type="text" id="username" name="username" value="" />
    <button id='submitButton' name="">Search</button>
<form>

<script>
 $('#myForm').submit(function(event) {
        event.preventDefault();
        var formData = $(this).serialize(); 
        $.ajax ( {
            url: "myScript.php",
            type: 'GET',
            data: formData,
            success: function (data) {
               console.log(data);
            }
        } );
    });
</script>

myScript.php：

<?php 
$returnString = array();
$returnString['username'] = $_GET['username'];
echo json_encode($returnString);
?>

Answer 1

构建一个标准按钮（不提交），并在该按钮的onClick上，构建您的查询字符串并执行您的ajax调用。这比试图短路标准表格提交更容易。你的代码已经存在了。

如果有人手动输入带参数和点击的网址＆＃34; go＆＃34;，您的服务器端代码将返回与ajax调用相同的响应，因为服务器并不关心谁调用它，所以不用担心。我要做的是在ajax调用中添加一个额外的参数，在服务器端，如果存在此param（意味着它是从ajax调用并且数据将返回到现有页面），则返回json。如果参数丢失（意味着它是从标准提交中调用的），则返回一个完整的html文档，很可能是同一页面，但是已经在dom中处理了json。

让服务器端代码运行是非常常见的，如果它是一个ajax，请返回此信息，否则返回此AND一个完整的HTML文档＆＃34;。

使用jQuery ajax使用GET处理表单和URL

1 个答案: