一个简单的jquery ajax表单提交 带数据校验 layer弹框提示
2024-08-29 21:42:56
<input type="hidden" id="url" value="index.php"/>
<form id="form">
<label>姓名<sup>*</sup> <input type="text" name="name" id="name" placeholder="姓名" value=""></label>
<label>电话<sup>*</sup> <input type="text" name="mobile" id="mobile" placeholder="手机号码" value=""></label> <label>意向城市<sup>*</sup>
<input type="text" name="city" id="city" placeholder="意向城市" value="">
</label>
<button type="button" onclick="submitData()">提交</button>
</form>
</div>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/lib/layer.min.auto.js"></script>
<script> //ajax提交
function submitData() { //数据验证
if ($('#name').val() == '') {
layer.msg('姓名不能为空'); return false;
}
if ($('#mobile').val() == '') {
layer.msg('手机号码不能为空'); return false;
}
var phone = $('#mobile').val();
var myreg = /^(((13[0-9]{1})|(14[0-9]{1})|(17[0]{1})|(15[0-3]{1})|(15[5-9]{1})|(18[0-9]{1}))+\d{8})$/;
if(!myreg.test(phone)){
layer.msg ( "请输入有效的手机号码!");
return false;
} if ($('#city').val() == '') {
layer.msg('意向城市不能为空'); return false;
} var url = $("#url").val();
var data = $("#form").serialize();
$.ajax({
url: url,
type: "POST",
url: url,
data: data,
async: false, success: function (res) { var obj = jQuery.parseJSON(res); if (obj.rst == 1) { layer.msg("提交成功"); setTimeout("location.reload()",2000); } else {
layer.msg(obj.msg); setTimeout("location.reload()",2000); }
}
}); }
</script>
最新文章
- IOS导航栏颜色渐变与常用属性
- centos 常见软件安装
- Oracle数据库——体系结构
- CRM-性能测试报告
- Android 手机配office365邮箱
- JavaScript高级程序设计(第三版)第五章 引用类型
- 30个实用的Linux find命令示例
- Java Thread UncaughtExceptionHandler
- 基于Vuforia的Hololens图像识别
- 【模拟】NEERC15 A Adjustment Office (2015-2016 ACM-ICPC)(Codeforces GYM 100851)
- ";红色病毒";问题 HDU 2065 递推+找循环节
- WPF XAML之bing使用StringFormat(转)
- MySQL的基本数据类型与数据类型优化
- Kettle jdbc连接hive出现问题
- 序列化之protobuf与avro对比(Java)
- 2016 ACM/ICPC Asia Regional Dalian Online Football Games
- 常用的js效果
- oracle根据某个字段的值进行排序
- windows 下 Django 搭架子 - 从建立project到建立app
- SAP MM 并非奇怪现象之MB5B报表查不到某一笔出库记录?