AJAX 新手。有点不确定如何在不重新加载整个页面的情况下提交 GET 请求。
- 用户访问
www.example.com/products/
- 类型“园艺工具”
- 结果会随着
www.example.com/products/results?search=Gardening+Tools
的网址更改而内联加载,无需重新加载页面即可完成。 - 任何用户都可以使用网址
www.example.com/products/results?search=Gardening+Tools
并获得相同的结果。
注意:第 4 点很重要。它一定不是某种简单的方法,只是将参数添加到 URL 中,使其看起来像这样。有些用户可能想要添加书签(这就是我首先使用 GET
请求的原因)。
这是我的代码的基本表示,适用于 POST
:
表单:使用 POST
进行基本提交,我希望它是 GET
。
<form id="submit" action="" method="POST">
<input type="text" name="search"/>
<button type="submit"></button>
</form>
jQuery:使用 .ajax()
我们向 /products/results.php
发送 POST
请求
$('form#submit').submit(function (e) {
e.preventDefault();
$.ajax({
type: 'POST',
url: 'results.php',
data: "search="+encodeURIComponent($('input[name="search"]').val()),
dataType: 'json',
success: function(data) {
//inject some html into page
}
});
}
results.php:(也只是为了确保我在这里免受 SQL 注入(inject)的保护?魔术引号已关闭)。
$query = $_POST['search'];
$query = mysql_real_escape_string($query);
$query = htmlspecialchars($query);
//you get the point: straight forward db connect, query and return as json
<小时/>
所以我尝试将所有 POST
更改为 GET
但没有成功。有什么概念我不明白吗?
我认为这可能与$('form#submit').submit(function (e)
和preventDefault()函数有关。但是需要preventDefault来停止页面重新加载.
最佳答案
<input type="text" name="search" id="search"/>
并且
$('form#submit').submit(function (e) {
e.preventDefault();
var search = $('#search').val();
$.ajax({
type: 'POST',
url: 'results.php',
data: {search:search},
dataType: 'json',
success: function(data) {
//inject some html into page
}
});
}
关于php - 使用 ajax 和 GET 请求实现搜索而无需重新加载(例如 Amazon.com),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16028482/