首页 > 代码库 > JS表单验证
JS表单验证
1 @{ 2 ViewBag.Title = "UpdateUserInfo"; 3 Layout = "~/Views/zjg669/Shared/_Layout.cshtml"; 4 } 5 @using System.Data; 6 @using System.Data.SqlClient; 7 @if (Session["Accounts"] != null) 8 { 9 DataTable Userdt = ViewBag.Userdt as DataTable; 10 11 DataTable Userdt2=ViewBag.UserInfodt as DataTable; 12 <div id="InfoManage"> 13 </div> 14 <script type="text/javascript"> 15 $(function () { 16 $("#InfoManage").load("/Account/InfoManage"); 17 }); 18 $(function () { 19 $("#toolbag").load("/Account/TopTitleBar"); 20 }); 21 </script> 22 if (@Userdt.Rows[0][7].ToString() == "1") 23 { 24 <script type="text/javascript"> 25 $(function () { 26 $("#sex1").attr("checked", "checked"); 27 }) 28 </script> 29 } 30 else 31 { 32 <script type="text/javascript"> 33 $(function () { 34 $("#sex2").attr("checked", "checked"); 35 }) 36 </script> 37 } 38 <div class="tzy_ny_right"> 39 <div class="tzy_ny_right_title"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_ny_title_4.jpg" > 40 <p> 您当前位置是：@Html.ActionLink("首页","Index","Home") > @Html.ActionLink("个人中心","Index","Account") > @Html.ActionLink("修改个人资料","UpdateUserInfo","Account") </p> 41 </div> 42 <div class="tzy_hd"> 43 <p><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_main_8_1.jpg"></p> 44 <div class="tzy_hd_nr"> 45 <div class="tzy_zhzx_xgzl"> 46 <div class="tzy_zhzx_title"> 47 <h3>修改资料</h3> 48 <p>@Html.ActionLink("返回上一级","Index","Account")</p> 49 </div> 50 <div class="tzy_zhzx_xgzl_nr"> 51 <div class="tzy_zhzx_xgzl_right"> 52 <table class="tzy_zhzx_xgzl_table"> 53 <tbody> 54 <tr> 55 <td>账 号：</td> 56 <td><table cellpadding="0" cellspacing="0" border="0" width="0"> 57 <tbody> 58 <tr> 59 <td align="right" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8.jpg" height="33" width="10"></td> 60 <td><input id="txtNickName" readonly="readonly" class="tzy_ss_8" onblur="IsBadWord()" name="txtNickName" value="http://www.mamicode.com/@Userdt.Rows[0][6]" type="text"></td> 61 <td align="left" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8_3.jpg" height="33" width="10"></td> 62 <td width="10"></td> 63 <td id="spanNikenName"></td> 64 </tr> 65 </tbody> 66 </table></td> 67 </tr> 68 <tr> 69 <td>性 别：</td> 70 <td><table cellpadding="0" cellspacing="0" align="left" border="0" width="0"> 71 <tbody> 72 <tr> 73 <td width="24"><input id="sex1" name="sex" value="http://www.mamicode.com/1" type="radio"></td> 74 <td align="left" width="16">男</td> 75 <td width="10"> </td> 76 <td width="24"><input id="sex2" name="sex" value="http://www.mamicode.com/0" type="radio"></td> 77 <td align="left" width="19">女</td> 78 </tr> 79 </tbody> 80 </table></td> 81 </tr> 82 <tr> 83 <td>个性签名：</td> 84 <td><table cellpadding="0" cellspacing="0" border="0" width="0"> 85 <tbody> 86 <tr> 87 <td align="right" valign="top" width="10"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8.jpg" height="33" width="10"></td> 88 <td align="left" valign="top" width="300"><input name="txtSignature" id="txtUnderwrite" value="http://www.mamicode.com/@(Userdt.Rows[0][12])" onkeyup="MaxLimit(this,50,‘#remLen‘)" maxlength="50" class="tzy_ss_8" style="width:300px" type="text"></td> 89 <td align="left" valign="top" width="10"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8_3.jpg" height="33" width="10"></td> 90 </tr> 91 </tbody> 92 </table></td> 93 </tr> 94 <tr> 95 <td> </td> 96 <td align="left">最多50个字符，还可输入<span id="remLen" style="color:Red" >50</span>字符。</td> 97 </tr> 98 <tr> 99 <td>真 实 姓 名：</td>100 <td><table cellpadding="0" cellspacing="0" border="0" width="0">101 <tbody>102 <tr>103 <td align="right" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8.jpg" height="33" width="10"></td>104 <td><input id="txtNickName1" class="tzy_ss_8" maxlength="12" onblur="IsBadWord()" name="txtRearName" value="http://www.mamicode.com/@Userdt2.Rows[0][1]" type="text"></td>105 <td align="left" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8_3.jpg" height="33" width="10"></td>106 <td width="10"></td>107 <td id="spanNikenName1"></td>108 </tr>109 </tbody>110 </table></td>111 </tr>112 <tr>113 <td>手 机 号 码：</td>114 <td><table cellpadding="0" cellspacing="0" border="0" width="0">115 <tbody>116 <tr>117 <td align="right" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8.jpg" height="33" width="10"></td>118 <td><input id="txtNickName2" class="tzy_ss_8" ebar="#spMobEmsg" valid-type="isMobile" name="txtPhone" value="http://www.mamicode.com/@Userdt2.Rows[0][5]" type="text"></td>119 <td align="left" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8_3.jpg" height="33" width="10"></td>120 <td><span id="spMobEmsg" style="color:red; display:none">手机号码格式错误!</span></td>121 <td id="spanNikenName2"></td>122 </tr>123 </tbody>124 </table></td>125 </tr>126 <tr>127 <td>固 定 电 话：</td>128 <td><table cellpadding="0" cellspacing="0" border="0" width="0">129 <tbody>130 <tr>131 <td align="right" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8.jpg" height="33" width="10"></td>132 <td><input id="txtNickName3" class="tzy_ss_8" ebar="#spTelEmsg" valid-type="isTel" name="txtFixPhone" value="http://www.mamicode.com/@Userdt2.Rows[0][4]" type="text"></td>133 <td align="left" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8_3.jpg" height="33" width="10"></td>134 <td><span id="spTelEmsg" style="color:red;display: none">电话号码格式错误！</span>固话格式:区号-电话</td>135 <td id="spanNikenName3"></td>136 </tr>137 </tbody>138 </table></td>139 </tr>140 <tr>141 <td>Q Q /M S N：</td>142 <td><table cellpadding="0" cellspacing="0" border="0" width="0">143 <tbody>144 <tr>145 <td align="right" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8.jpg" height="33" width="10"></td>146 <td><input id="txtNickName4" class="tzy_ss_8" ebar="#spQQEmsg" valid-type="isNum" name="txtFixPhone" value="http://www.mamicode.com/@Userdt2.Rows[0][2].ToString()" type="text"></td>147 <td align="left" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8_3.jpg" height="33" width="10"></td>148 <td><span id="spQQEmsg" style="color:red; display: none">格式错误！</span></td>149 <td id="spanNikenName4"></td>150 </tr>151 </tbody>152 </table></td>153 </tr>154 <tr>155 <td>E m a i l：</td>156 <td><table cellpadding="0" cellspacing="0" border="0" width="0">157 <tbody>158 <tr>159 <td align="right" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8.jpg" height="33" width="10"></td>160 <td><input id="txtNickName5" class="tzy_ss_8" ebar="#spMailEmsg" valid-type="isMail" name="txtEmail" value="http://www.mamicode.com/@Userdt2.Rows[0][3].ToString()" type="text" required></td>161 <td align="left" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8_3.jpg" height="33" width="10"></td>162 <td ><span id="spMailEmsg" style="color:red; display: none">邮箱格式错误(必填项)！</span></td>163 <td id="spanNikenName5"></td>164 </tr>165 </tbody>166 </table></td>167 </tr>168 <tr>169 <td>详 细 地 址</td>170 <td><table cellpadding="0" cellspacing="0" border="0" width="0">171 <tbody>172 <tr>173 <td align="right" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8.jpg" height="33" width="10"></td>174 <td><input id="txtNickName6" class="tzy_ss_8" maxlength="100" name="txtAddress" value="http://www.mamicode.com/@Userdt2.Rows[0][6]" type="text"></td>175 <td align="left" valign="top"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8_3.jpg" height="33" width="10"></td>176 <td width="10"></td>177 <td id="spanNikenName6"></td>178 </tr>179 </tbody>180 </table></td>181 </tr>182 <tr style="display:none">183 <td>个性签名：</td>184 <td><table cellpadding="0" cellspacing="0" border="0" width="0">185 <tbody>186 <tr>187 <td align="right" valign="top" width="10"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8.jpg" height="33" width="10"></td>188 <td align="left" valign="top" width="300"><input name="txtSignature" value="http://www.mamicode.com/@Userdt2.Rows[0][9]" id="txtSignature1" onkeydown="MaxLimit();" onkeyup="MaxLimit();" class="tzy_ss_8" style="width:300px" type="text"></td>189 <td align="left" valign="top" width="10"><img src="http://www.mamicode.com/Content/zjg669/Images/tzy_zhcz_8_3.jpg" height="33" width="10"></td>190 </tr>191 </tbody>192 </table></td>193 </tr>194 195 </tbody>196 </table>197 </div>198 </div>199 </div>200 <div class="tzy_nr_tj">201 <p class="tzy_an_21" style="width:200px;">202 <input name="button" src="http://www.mamicode.com/Content/zjg669/Images/bntSubmit.jpg" id="btnSubmit" value="http://www.mamicode.com/提交修改" onclick="OnSubmit()" type="image">203 </p>204 </div>205 </div>206 <p> </p>207 </div>208 </div>209 <script src="http://www.mamicode.com/~/Scripts/zjg669/Js/formRegExpHelper.js"></script>210 <script src="http://www.mamicode.com/Scripts/Js/HtmlValidate.js" type="text/javascript"></script>211 212 <script type="text/javascript">213 var isFlag = true;214 function validReg(_this) {215 if (!isInput($(_this).val(),216 $(_this).attr("required"),217 $(_this).attr("valid-type"),218 $(_this).attr("ebar")))219 isFlag = false;220 }221 $("input[valid-type]").blur(function () {222 validReg(this);223 });224 function OnSubmit() {225 isFlag = true;226 $("input[valid-type]").each(function () {227 validReg(this);228 });229 if (!isFlag){return ;}230 $.post("/Account/UpdateUserInfo",231 {232 dwGender: $("input[name=sex]:checked").val(),233 strUnderWrite: $("#txtUnderwrite").val(),234 strCompellation: $("#txtNickName1").val(),235 strQQ: $("#txtNickName4").val(),236 strEmail: $("#txtNickName5").val(),237 strMobilePhone: $("#txtNickName2").val(),238 strSeatPhone: $("#txtNickName3").val(),239 strDwellingPlace: $("#txtNickName6").val(),240 strUserNote: $("#txtSignature1").val()241 }, function (data) {242 window.location.href = "http://www.mamicode.com/Account/Index";243 }244 )245 };246 247 248 //签名长度判断249 function MaxLimit(_this, ml, msgbar) {250 if ($(_this).val().length > ml) {251 $(_this).val($(_this).val().substr(0, ml));252 }253 $(msgbar).text(ml - $(_this).val().length);254 }255 MaxLimit(‘#txtUnderwrite‘, 50, ‘#remLen‘);256 </script>257 }258 else259 {260 Response.Redirect("/Account/Index");261 }
1 var relist = { 2 isMobile: /^((\+?86)|(\(\+86\)))?1\d{10}$/, 3 isTel: /^((\+?86)|(\(\+86\)))?\d{3,4}-\d{7,8}(-\d{3,4})?$/, 4 isMail: /^\w+([-.]?\w+)*@\w+([-.]?\w+)*.\w+([-.]?\w+)*$/, 5 isNum: /^\d{5,15}$/ 6 } 7 8 function isInput(k, isreq, type, ebar, emsg) { 9 var reg = relist[type];10 var ret = reg.test(k);11 if (!isreq && k === "") ret = true;12 if (ebar) {13 $(ebar).html(emsg ? emsg : $(ebar).html());14 ret ? $(ebar).hide() : $(ebar).show();15 }16 return ret;17 }
JS表单验证
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。