在注册页面,我们经常要用到页面验证,验证到不符合要求的数据就阻止提交到服务器,如下

<script type="text/javascript">
function Check() {
var phoneNumber = $.trim($("#PhoneNumber").val());
var isMobile=/^1?(3|5|7|8)\d{9}$/;
if (isMobile.test(phoneNumber) == false) {
alert("电话号码格式错误");
$("#PhoneNumber").focus();
return;
}
}
</script>
<input type="submit" name="addNewAddress" value="保存收货地址" class="saveNewAddress" onclick="Check()"/>

效果:这样看起来貌似没有问题,但是这样往往能够提示判断出错误的手机号码,但是却不能阻止它提交到后台;

原因:其实是check()只是一个验证手机号的动作,并没有阻止提交的动作。提交表单时先执行check()这个函数再post,post的时候会执行页面判断(判断一个值,具体是什么值需要了解整个post的过程,这里我也不太清楚)如果是true,就post页面,如果是false,就不执行任何动作。

解决方法:在check()方法里执行验证之后,如果验证符合要求就返回true,否则返回false;在调用方法的地方加上“return 方法名”(这里就是return Check(););完整的代码如下:

<script type="text/javascript">
function Check() {
var phoneNumber = $.trim($("#PhoneNumber").val());
var isMobile=/^1?(3|5|7|8)\d{9}$/;
if (isMobile.test(phoneNumber) == false) {
alert("电话号码格式错误");
$("#PhoneNumber").focus();
return false;
}
return true;
}
</script>
<input type="submit" name="addNewAddress" value="保存收货地址" class="saveNewAddress" onclick="return Check();"/>

js阻止提交表单(post)的更多相关文章

  1. JS、jqueryie6浏览器下使用js无法提交表单的解决办法

    -----------------------JS.jqueryie6浏览器下使用js无法提交表单的解决办法---------------------------------------------- ...

  2. js阻止form表单重复提交

    防止表单重复提交的方法总体来说有两种,一种是在js中阻止重复提交:另一种是在后台利用token令牌实现,大致思路是生成一个随机码放到session和form表单的隐藏输入框中,提交表单时两者对比,表单 ...

  3. js 回车提交表单的实现

    我们有时候希望回车键敲在文本框(input element)里来提交表单(form),但有时候又不希望如此.比如搜索行为,希望输入完关键词之后直接按回车键立即提交表单,而有些复杂表单,可能要避免回车键 ...

  4. jQuery.Form.js 异步提交表单使用总结

    jQuery.Form.js 是一个用于使用jQuery异步提交表单的插件,它使用方法简单,支持同步和异步两种方式提交. 第一步:引入jQuery与jQuery.Form.js <script ...

  5. JS post提交表单

    js post方式提交表单有两种办法,1:AJAX提交 2:在JS里拼出一个form,然后submit 第二种办法的代码 //这个主要是解决给password MD5 var email = 'ema ...

  6. 转 js调用提交表单。

    今天做网银支付的时候,需要做到点击支付的时候提交订单,然后新窗口打开支付界面. 思路1:window.open(''),这个直接被pass了,因为银行的服务一般都是需要post数据的.就算是可以用ge ...

  7. JS:JS判断提交表单不能为空等验证

    这段代码在<form>中有οnsubmit="return on_submit()",如果 onsubmit ()返回 fasle,表单的元素就不会提交,即action ...

  8. js 回车提交表单

    一.整个页面用一个回车提交事件: <input type="button" value="回车提交" id="auto" onclic ...

  9. js 判断提交表单

    <SCRIPT language=javascript> function check_book() { if(document.form1.Username.value=="& ...

随机推荐

  1. matlab 按照某列以行为单位进行排序

    a=[2 1 3 21 44 3] 然后按照第一列进行排序 sortrows(a,1) ans = 1 4 2 1 3 2 4 3 如要逆序,可以逆序读矩阵即可

  2. 第三周作业--VS 2013 单元测试

    VSTS可以实现自动测试,简而言之就是编写一个测试程序的程序,通过输入自动判断输出是否与预想相符,并给出代码覆盖率等等一大堆统计数据,以下为如何利用这一功能的简介. 1.新建项目,创建一个类.即要完成 ...

  3. 服务器控件中使用<%#...>, JS和html控件中使用<%=...>

    //在服务器控件的属性中,需要用<%#...>来绑定其他控件的ID, 并且要在页面初始方法中,执行Page.DataBind(); <asp:ImageButton ID=" ...

  4. Canvas画图在360浏览器中跑偏的问题

    问题描述,canvas画图的js代码中编写的是画正方形的代码,结果在360浏览器上变成了长方形,不知道怎么回事,请问各位大神是否遇到过此类问题? <!DOCTYPE html> <h ...

  5. table变色

    <!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...

  6. 浅析jquery ui的datepicker组件

    今天计划在博客上添加一个日历,方便用户查看日期.Google了一圈,最终决定使用jquery ui的datepicker部件实现.原因有三:Datepicker使用配置比较简洁,几行代码就可以得到一个 ...

  7. java 基本语法

    标识符 标识符就是给变量.类或方法起的名字. 标识符由26个英文字符大小写(a~zA~Z).数字(0~9).下划线(_)和美元符号($)组成 不能以数字开头,不能是关键字 严格区分大小写 标识符的可以 ...

  8. nw_socket_handle_socket_event解决

    http://www.bkjia.com/IOSjc/1158465.html 出现问题如下 to a parent directory scheduled for deletion nw_endpo ...

  9. C++设计模式-策略模式(2)

    策略模式:策略模式针对一组算法,将每一个算法封装到具有共同接口的独立的类中从而使得它们可以相互替换. 策略模式使得算法可以在不影响到客户端的情况下发生变化.策略模把行为和环境分开.环境类负责维持和查询 ...

  10. 使用date类和format类对系统当前时间进行格式化显示

    一:Date------------String 代码1:(代码二对显示出来的时间格式进行优化) package DateDemo; import java.text.SimpleDateFormat ...