浏览 2469 次
|
锁定老帖子 主题：Button提交数据注意写法
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2013-09-20
今天做一个功能，页面提交数据到后台。做的多了功能很熟，写代码基本从做过的地方拷拷过来用。今天也很随意的从别处拷代码过来。很快功能完成了。测试下来，一点提交按钮页面刷新一下输入框填的数据全清空了。废话不多说。上代码分析问题。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Button测试</title>
<script type="text/javascript" src="http://global.z7zba.com/js/jquery-1.9.1.min.js"></script>
</head>
<body>
<form>
T1<input type="text" id="t1" name="t1" value="" />
T2<input type="text" id="t2" name="t2" value="" />
<br />
<input type="submit" onclick="doAction();" value="按钮1(type=submit)" />
<button onclick="doAction();">按钮2(button)</button>
<input type="button" onclick="doAction();" value="按钮3(type=button)" />
<a href="javascript:doAction();">按钮4(a)</a>
</form>
<div style="border-bottom:#000;">----form外----</div>
<script type="text/javascript">
function doAction()
{
if($('#t2').val() == '') { alert('T2为空'); return; }
}
</script>
</body>
</html>
有四个按钮，都可以做点击后提交动作。 我们先来做测试。 在T1输入框中随意输入如：x,然后点击各按钮 所有按钮放在form内 1 发现点击按钮1和按钮2时,弹出提示框后页面刷新，T1输入框的值被清空。 我们把按钮1和按钮2放到form外面，再次执行如上操作 2 发现所有按钮,弹出提示框后页面，没有刷新，T1输入框的值没有被清空。 注：按钮3和按钮4放在form里面和里面，效果属于第2种结果 以上在chrome和firxfox中测试过。欢迎大家验证。 总结：写提交动作时，按钮尽量用a或input[type='button'] 声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
