我有这样一个表单:
<form action= 'addperm.php' class = 'addperm' method='post'>
<input type='text' name='user' /><br />
<input type='radio' name='perm' value='1' CHECKED /> Can view only<br />
<input type='radio' name='perm' value='2' /> Can make changes <br />
<input type='submit' value='Add'>
</form>
我想知道如何,不重定向到另一个页面,我可以得到这两个输入值(用户和perm),通过ajax将它们发布到php脚本,然后让php返回结果
阅读$.post的jQuery API文档。
$('input[type=submit]').click(function(e){
$.ajax({
type: "POST",
url: "some.php",
data: "user=" + $('input[name=user]').val() + "&perm=" + $('input[name=perm]:checked').val(),
success: function(msg){
// msg is your content
}
});
e.preventDefault();
});
some.php
echo json_encode(array($_POST['user'],$_POST['perm']));
从http://jquery.com下载jQuery
将其包含在你的页面标题中,如:
<script type="text/javascript" src="jquery/jquery.min.js"></script>
把src改成你下载的文件名
然后在页面的头部粘贴这个:
<script type="text/javascript">
$(document).ready(function() {
$('.addperm').submit(function(){
var query = 'perm='+$('#perm').val()+'&user='+$('#user').val();
$.post("addperm.php", query, function(response){
alert(response);
});
});
});
</script>
要使这个工作,你必须改变你的HTML为:
<form action= 'addperm.php' class = 'addperm' method='post'>
<input type='text' name='user' id='user' /><br />
<input type='radio' name='perm' value='1' id='perm' CHECKED /> Can view only<br />
<input type='radio' name='perm' value='2' id='perm' /> Can make changes <br />
<input type='submit' value='Add'>
</form>
我还没有测试过,但是应该可以。