我对 JQuery 和 Ajax 函数相当陌生,我不明白为什么我的脚本总是损坏。我基本上有一个表单,用户可以在其中输入他们的姓名和位置。当用户提交表单时,脚本使用 JQuery 的 $.post() 函数将用户值发送到“locationHandler.php”,该函数获取用户信息(名称和位置)并将其存储在 mysql 数据库中。 $.post 请求成功后,我想使用 JQuery 的 .load() 函数来更新任意 div 标签内的 html。每次提交表单时,脚本都会将数据存储到 mysql 数据库中,正如预期的那样,但是脚本无法 .load() 我的 php 文件。
这是我的index.php页面的代码:
<?php ?>
<html>
<head>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#locationForm").submit(function() {
var unameVal = $("#locationForm input[name='uname']").val();
var locationVal = $("#locationForm select[name='location']").val();
$.post("locationHandler.php", {uname: unameVal, location: locationVal}, function() {
$("#display").load("defaultPhp.php");
});
});
});
</script>
</head>
<body>
<form id="locationForm" method="post">
<label>Name:</label>
<input type="text" name="uname" />
<label>Location:</label>
<select name="location">
<option value="uncc">UNC Charlotte</option>
<option value="ncsu">NC State</option>
</select>
<input type="submit" value="Submit" />
</form>
<div id="display"></div>
</body>
</html>
以下是我的 defaultPhp.php 页面的代码,该页面与我的 index.php 页面位于同一目录中:
<?php
echo "<p>This is some arbitrary text</p>";
?>
我尝试删除 $(document).ready(function(e) { ... });
并将脚本标签直接放在结束 </form>
下方标签,但随后脚本停止将数据存储到 mysql 数据库中。
首先,为什么我删除 $(document).ready(function(){...});
从上面的脚本来看,它会停止将值存储到 mysql 数据库中吗?
其次,为什么脚本不会将我的 defaultPhp.php 页面的内容加载到 div 标记中?
最佳答案
请在提交函数结束之前使用return false。
关于javascript - Jquery(ajax)加载功能不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26967614/