javascript 使用ajax将输入值发送到php并将结果打印到div
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18593082/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Send input value to php using ajax with result printed to div
提问by user2743057
I'm trying to send an input value to a php script and have the returned value posted to a div, using ajax, but I can't seem to get this right. Any help/suggestions would be appreciated. Thanks!!
我正在尝试使用 ajax 将输入值发送到 php 脚本，并将返回值发布到 div，但我似乎无法做到这一点。任何帮助/建议将不胜感激。谢谢！！
This is what I have by now, but console says: "Failed to load resource: the server responded with a status of 404 (Not Found)".
这就是我现在所拥有的，但控制台说：“加载资源失败：服务器响应状态为 404（未找到）”。
test1.php:
测试1.php：
<script>
$.ajax({
type: 'POST',
url: 'test2.php',
data: {url: $('#id1').val()},
success: function (data)
{
$(document).ready(function(){$("#content").load("test2.php");});
}
});
</script>
<form name="input">
<input type="text" id="id1">
<input type="submit">
</form>
<div id="content"></div>
test2.php:
测试2.php：
<?php
$string=$_POST['id1'];
require_once('connect.php');
$inf = "SELECT * FROM `comments` WHERE date='$string'";
$info = mysql_query($inf);
while($info2 = mysql_fetch_object($info)) {echo $info2->username.$info2->date;}
?>
采纳答案by Ben Fortune
<script>
$(document).ready(function() {
$('#submit').click(function(e) {
e.preventDefault();
$.ajax({
type: 'POST',
url: 'test2.php',
data: {id1: $('#id1').val()},
success: function(data)
{
$("#content").html(data);
}
});
});
});
</script>
<form name="input">
<input type="text" id="id1">
<input type="submit" id="submit">
</form>
<div id="content"></div>
When you submit the ajax request, you're already submitting your content to test2.php, so you don't need to load it again. In the success function, you can append the result to the div from the callback.
当您提交 ajax 请求时，您已经将内容提交到test2.php，因此您不需要再次加载它。在成功函数中，您可以将结果从回调附加到 div。
回答by Liam Allan
You could try this:
你可以试试这个：
<script>
$('#submitBtn').on('click',function(){
$.ajax({
type: 'POST',
url: 'test2.php',
data: {url: $('#id1').val()},
success: function (data)
{
$("#content").html(data);
}
});
return false;
});
</script>
<form name="input">
<input type="text" id="id1">
<input id="submitBtn" type="submit">
</form>
<div id="content"></div>
回答by Bhadra
$(document).on('click','#submit',function(e) {
e.preventDefault();
$.post('test2.php',{url: $('#id1').val()},function(data){
$("#content").html(data);
}
});
});
回答by Sujit Patil
404 (Not Found) Erroris for page not found. Please make sure that file test2.phpis exist in same folder. Check url.
404 (Not Found) Error用于未找到页面。请确保文件test2.php存在于同一文件夹中。检查网址。
Also you can copy the URL from console and paste it in the browser URL to check the url correct or incorrect.
您也可以从控制台复制 URL 并将其粘贴到浏览器 URL 中以检查 URL 是否正确。
jQuery
jQuery
<script>
$(document).ready(function() {
$('#submit').click(function(e) {
e.preventDefault();
$.ajax({
type: 'POST',
url: 'test2.php',
data: {id1: $('#id1').val()},
success: function(data)
{
$("#content").html(data);
}
});
});
});
</script>
HTML
HTML
<form name="input">
<input type="text" id="id1">
<input type="submit" id="submit">
</form>
