首先我创建了一个表单,为了测试方便,每个都加了id。
<form id="logInfo">
<label for="id">用户名</label>
<input type="text" name="id" id="id" placeholder="请输入用户名" />
<br />
<label for="pw">密码</label>
<input type="password" name="pw" id="pw" placeholder="请输入密码" />
<input type="submit" value="确认" id="btn"/>
</form>
页面效果
原来无效的jq
<script>
$(function () {
$("#btn").click(function () {
$.post(
'/Home/Index',
{"id":$("#id").val(),"pw":$("pw").val()},
function (data) {
alert("aaa");
}
)
});
})
</script>
结果点击确认后
这个index就是Login,做个小测试懒得改了
根据这个url的显示,点击确认后是进行了get的传递,而非post
我原先认为会出现这个问题是因为我的【确认】的类型是submit
<input type="submit" value="确认" id="btn"/>
当我把type改为button后再次进行了尝试
<input type="button" value="确认" id="btn"/>
输入完用户名密码后点击确认没有任何反应
后来才发现是我data段写错了,虽然我不知到哪里错(id和pw加不加双引号我都试过了无效)
我之前没有接触过serialize()方法,不知到如此好用
改完之后
<script>
$(function () {
$("#btn").click(function (e) {
e.preventDefault();
$.post(
'/Home/Index',
$("#logInfo").serialize(),
function (data) {
alert("aaa");
}
)
});
})
</script>
这是我在网上一个论坛里看到类似问题最后的结帖答案
这个preventDefault()应该是防止确认按钮的submit功能吧,具体的功能我也没有尝试过
如果哪位知道为什么我第一次写的jq回事get传递,和我的data哪里有问题的请在下面评论区解答一下,有什么错误问题请指出