為什么我的Ajax函數不起作用？
[英]Why doesn't my Ajax function work?
問題描述
我正在嘗試使用一種形式將兩個JavaScript變量提交到php腳本，並通過ajax函數將輸出返回到同一頁面上的新Div。 沒用
這是我的代碼
javascript / html
<link href="style/background.css" rel="stylesheet" type="text/css">
<script src="scripts/jquery-1.9.1.js"></script>
<script type="text/javascript">
fbPageOptions = {
shadowType: 'halo',
resizeDuration: 5.5,
imageFadeDuration: 4.5,
overlayFadeDuration: 0,
navType: 'both',
width: 580,
height: 405
};
</script>
<body>
<div id ="userForm">Add New User
<br>
<br>
<form id ="form">
First name: <input type="text" name="firstname" id="firstname"><br>
Last name: <input type="text" name="lastname" id="lastname" ><br>
<input type="submit" value="Submit" id="submit">
</form>
</div>
<script type="text/javascript">
var firstname = "";
var lastname = "";
$('#form').submit(function() {
firstname = $("input#firstname").val();
lastname = $("input#lastname").val();
alert(firstname + lastname);
$.ajax({
type: "POST",
url: "my url is in here",
data: {firstname: firstname, lastname: lastname},
success: function(data) {
$("#submitted").html(data);
alert("success");
}
});
});
</script>
<br>
<div id="submitted"></div>
</body>
這是PHP代碼
<?php
$firstname = $_POST["firstname"];
echo "First name added is $firstname";
echo "<br>";
$lastname = $_POST["lastname"];
echo "Last name added is $lastname";
?>
當我提交表單時，警報框會觸發，但div不會更新。 我在另一頁上使用了幾乎相同的代碼，並且工作正常。 ：（ 有任何想法嗎？
非常感謝。
3 個解決方案
解決方案1
4 2013-06-11 10:46:41
表單提交后，重新加載頁面，您需要防止默認的Submit事件：
$('#form').on('submit', function (e) {
e.preventDefault();
var firstname = $("#firstname").val(),
lastname = $("#lastname").val();
$.ajax({
type: "POST",
url: "my url is in here",
data: {
firstname: firstname,
lastname: lastname
}
}).done(function (data) {
$("#submitted").html(data);
alert("success");
});
});
解決方案2
3 已采納 2013-06-11 10:47:42
在Submit函數中返回false可以防止導致問題的Submit的默認行為。
$('#form').submit(function() {
firstname = $("input#firstname").val();
lastname = $("input#lastname").val();
alert(firstname + lastname);
$.ajax({
......
});
return false;
});
解決方案3
1 2013-06-11 10:55:47
您應該使用$ .param或.serialize之類的方法向您發送數據。
Ajax，為什么setInterval函數不起作用？
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.