jQuery Ajax 在 php 同一页面上传递值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7561569/
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
jQuery Ajax passing value on php same page
提问by GianFS
I am kinda confused on it, when trying to send value on the same page.
尝试在同一页面上发送值时，我对此感到有些困惑。
<script>
$("select[name='sweets']").change(function () {
var str = "";
$("select[name='sweets'] option:selected").each(function () {
str += $(this).text() + " ";
});
jQuery.ajax({
type: "POST",
data: $("form#a").serialize(),
success: function(data){
jQuery(".res").html(data);
$('#test').text($(data).html());
}
});
var str = $("form").serialize();
$(".res").text(str);
});
</script>
<div id="test">
<?php
echo $_POST['sweets'];
?>
</div>
<form id="a" action="" method="post">
<select name="sweets" >
<option>Chocolate</option>
<option selected="selected">Candy</option>
<option>Taffy</option>
<option>Caramel</option>
<option>Fudge</option>
<option>Cookie</option>
</select>
</form>
Well it will display if its in the top of html tag but if its inside the body it will display null.
好吧，如果它在 html 标签的顶部，它将显示，但如果它在正文中，它将显示为空。
回答by Muhammad Usman
Here is the working code for you. To send ajax request to the same page you can keep urlparameter empty, which you are already doing. If you are trying to make the script behave differently when $_POSThas value then use issetas I have used below.
这是您的工作代码。要将 ajax 请求发送到同一页面，您可以将url参数保留为空，这是您已经在做的。如果您试图使脚本在$_POST具有值时表现不同，请使用isset我在下面使用的方法。
<?php
if(isset($_POST['sweets']))
{
echo $_POST['sweets'];
exit;
}
?>
<script>
$(function(){
$("select[name='sweets']").change(function () {
var str = "";
$("select[name='sweets'] option:selected").each(function () {
str += $(this).text() + " ";
});
jQuery.ajax({
type: "POST",
data: $("form#a").serialize(),
success: function(data){
jQuery(".res").html(data);
$('#test').html(data);
}
});
var str = $("form").serialize();
$(".res").text(str);
});
});
</script>
<div id="test">
</div>
<form id="a" action="" method="post">
<select name="sweets" >
<option>Chocolate</option>
<option selected="selected">Candy</option>
<option>Taffy</option>
<option>Caramel</option>
<option>Fudge</option>
<option>Cookie</option>
</select>
</form>
回答by bfavaretto
You should wrap your code with
你应该用
$(document).ready(function(){
// your code here
});
This way, it will only run when the browser finishes processing the structure of your HTML.
这样，它只会在浏览器完成处理您的 HTML 结构时运行。
UPDATE
更新
There was a lot of debug stuff on your code, try this (requires Firebug to see the output of the ajax request):
您的代码中有很多调试内容，试试这个（需要 Firebug 才能看到 ajax 请求的输出）：
<script>
$(document).ready(function(){
$("select[name='sweets']").change(function () {
jQuery.ajax({
type: "POST",
data: $("form#a").serialize(),
success: function(data) {
// Check the output of ajax call on firebug console
console.log(data);
}
});
});
});
</script>
