正则表达式（jquery表单验证）⼀、实现的效果图：
⼆、CSS样式
/*验证样式*/
.onError{
vertical-align: middle;
color: #ff0000;
line-height: 22px;
padding: 2px 10px 2px 23px;
margin-left: 10px;
_margin-left: 5px;
background-image: url(../images/cuo.png);
background-repeat: no-repeat;
background-position: 0px 2px;
}
.onTan{
vertical-align: middle;
color: #343434;
line-height: 22px;
padding: 2px 10px 2px 23px;
margin-left: 10px;
_margin-left: 5px;
background-image: url(../images/tan.png);
background-repeat: no-repeat;
background-position: 0px 2px;
}
.onRight{
vertical-align: middle;
line-height: 22px;
padding: 2px 10px 2px 23px;
margin-left: 10px;
_margin-left: 5px;
background-image: url(../images/dui.png);
background-repeat: no-repeat;
background-position: 0px 2px;
}
⼆、JS
//发布快递专线（会员管理）
$(function () {
//⿏标指针触发是验证出发地⽹点是否合法
$("#txtStartLinkPhone").focus(function () {
$(this).next().show().removeClass("onError").removeClass("onright").addClass("ontan").html("请输⼊出发地⽹点");
}).blur(function () {
var patrn = /^(0[0-9]{2,3}\-)?([2-9][0-9]{6,7})+(\-[0-9]{1,4})?$|(^(13[0-9]|15[0|3|6|7|8|9]|18[8|9])\d{8}$)/;
if ($(this).val() != "") {
if (!($(this).val()))
$(this).next().removeClass("ontan").removeClass("onright").addClass("onError").html("出发地⽹点输⼊格式不正确");
else
$(this).next().removeClass("ontan").removeClass("onError").addClass("onright").html(" ");
}
else
$(this).next().removeClass("ontan").removeClass("onright").addClass("onError").html("出发地⽹点不能为空");
});
});
//button按钮提交时验证输⼊的电话是否合法
function StartLinkPhone() {
var patrn = /^(0[0-9]{2,3}\-)?([2-9][0-9]{6,7})+(\-[0-9]{1,4})?$|(^(13[0-9]|15[0|3|6|7|8|9]|18[8|9])\d{8}$)/;
if ($("#txtStartLinkPhone").val() != "") {
if (!($.trim($("#txtStartLinkPhone").val()))) {
$(this).next().removeClass("ontan").removeClass("onright").addClass("onError").html("出发地⽹点输⼊格式不正确");
return false;
}
else {
$(this).next().removeClass("ontan").removeClass("onError").addClass("onright").html(" ");
return true;
}jquery怎么进行验证
}
else {
$(this).next().removeClass("ontan").removeClass("onright").addClass("onError").html("出发地⽹点不能为空");
return false;
}
}
三、页⾯
<form id=form1>
<table cellspacing="10" cellpadding="10">
<tr>
<td class="td1">：<em class="red">*</em></td>
<td class="td2"><input type="text" id="txtStartLinkPhone" name="txtStartLinkPhone" value="@expressline.StartLinkPhone"></td> </tr>
<tr>
<td class="td1"></td>
<td class="td2"><input name="add" type="submit" value="添加" class="left btn3"></td>
</tr>
</table>
</form>
@section Js{
<script src="/js/expressline.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#txtStartLinkPhone").after("<span></span>");
$("#form1").submit(function () {
if(!StartLinkPhone()) {
$("#txtStartLinkPhone").focus().blur();
}
else {
$.post("/member/publishexpressline?action=get", $("this").serializeArray(), function (json) {
if (de == 1) {
//成功
alert(json.msg);
window.location = "/Member/ExpressLineManage";
}
else {
//失败
alert(json.msg);
}
});
}
return false;
}
})
</script>
}

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。