表格标签内容如下： –
<form method="post" action="" > 按钮标签内容为： –
j查询function是
$('#submit_button').click(function () { alert("button clicked"); buildingVal = $("#building").val(); levelVal = $("#level").val(); data = 'building=' + buildingVal.val() + 'level=' + levelVal.val(); $.ajax( { url: "res.php", type: "POST", data: data, success: function (data) { } }); return false; });
页面正在重新加载，文本框和下拉菜单中的数据正在消失。
但如果我在jquery中只有这个代码： –
$('#submit_button').click(function () { alert("button clicked"); return false; });
然后页面不重新加载，值保持不变。
请问您能告诉我如何阻止页面重新加载？
同样在ajax调用中，我将调用一个页面res.php，它将返回一个表，
代码是什么？
success: function (data) { }
请帮忙…
编辑：
我正在使用代码将数据传递到res.php页面
data = 'building=' + buildingVal.val() + 'level=' + levelVal.val();
然后使用将其传递到页面中
$.ajax( { url: "res.php", type: "POST", data: data, success: function (data) { $('#npc').html(data); } });
在res.php页面中
如何从传递的单个值中提取两个值
我尝试使用以下代码
$building = mysql_real_escape_string($_GET['building']); $level = mysql_real_escape_string($_GET['level']);
但它不起作用……
您在jQuery代码中有错误：
错误：
buildingVal = $("#building").val(); levelVal = $("#level").val(); data = 'building=' + buildingVal.val() + 'level=' + levelVal.val();
解：
buildingVal = $("#building"); levelVal = $("#level"); data = 'building=' + buildingVal.val() + '&level=' + levelVal.val();
完整代码js：
$('#submit_button').click(function () { var buildingVal = $("#building"), levelVal = $("#level"), data = 'building=' + buildingVal.val() + '&level=' + levelVal.val(); $.ajax({ 'url': 'res.php', 'type': 'POST', 'data': data, 'success': function (data) { } }); return false; });
编辑
如果您打算使用此表单通过ajax发送数据，最好的方法是取消事件“提交”表单：
HTML：
JS：
$('#myform').bind('submit', function(event) { return false; }); $('#submit_button').bind('click', function () { var buildingVal = $("#building"), levelVal = $("#level"), data = 'building=' + buildingVal.val() + 'level=' + levelVal.val(); $.ajax({ 'url': 'res.php', 'type': 'POST', 'data': data, 'success': function (data) { } }); });
最好的方法是首先不要使用submit按钮。
$('#myButton').on('click', function(){ //do ajax });
您需要阻止Click事件中的默认行为：
$('#submit_button').click(function (event) { event.preventDefault(); alert("button clicked"); return false; // Not truly necerssary });
因此，为了使提交按钮不以默认行为提交您的页面，请执行以下操作：
需要了解更多jQuery教程分享单击提交按钮时阻止页面重新加载并调用jquery函数，都可以关注jQuery技术分享栏目—计算机技术网(www.ctvol.com)!
$('#submit_button').click(function (event) { event.preventDefault(); buildingVal = $("#building").val(); levelVal = $("#level").val(); data = 'building=' + buildingVal.val() + 'level=' + levelVal.val(); $.ajax( { url: "res.php", type: "POST", data: data, success: function (data) { } }); });
以上就是jQuery教程分享单击提交按钮时阻止页面重新加载并调用jquery函数相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。
本文来自网络收集，不代表计算机技术网立场，如涉及侵权请联系管理员删除。
ctvol管理联系方式QQ:251552304
本文章地址：https://www.ctvol.com/jquerytutorial/982586.html