<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{ margin: 0; padding: 0; } .inner{ width: 1000px; height: 100px; margin: 100px auto; } p{ margin-top: 10px; margin-bottom: 10px; }div{ margin-top: 10px; margin-bottom: 10px; } h3{ margin-top: 10px; margin-bottom: 10px; } div button{ margin: 0 auto; } </style> </head> <body> <div class="inner"> <h3>首页>演示预约</h3> <p>请您认真填写如下信息,我们将根据您的需求安排客服人员尽快与您联系,我们将根 据您的详细需求为您提供一次远程上门演示,并结合演示效果为您开通满足您需求的 使用账号。</p> <div>公司名称:<input type="text" class="name"><span class="sname"></span></div> <div> 联 系 人 :<input type="text" class="linkman"><span class="slinkman"></span></div> <div> <input type="radio" name="sex" value="男" />男 <input type="radio" name="sex" value="女" />女 <span class="ssex"></span> </div> <div> 手 机 号 :<input type="text" class="number"><span class="snumber"></span></div> <div> 邮 箱 :<input type="text" class="email"><span class="semail"></span></div> <div> 需求:<input type="checkbox">人力资源管理 <input type="checkbox">客户关系管理 <input type="checkbox">项目管理<br> <input type="checkbox">项目财务核算 <input type="checkbox">工时管理 <input type="checkbox">费用管理<br> <input type="checkbox">文档管理 <input type="checkbox">物品管理 <input type="checkbox">员工自助平台<br> <input type="checkbox">职能BI <input type="checkbox">移动办公(可多选) <span class="scheckbox"></span> </div> <button class="btn">提交申请</button> <p>想了解更多信息,可进行咱先咨询或拨打免费客服热线电话4007-888-7772进行咨询</p> <script src="../jquery-1.11.1.min.js"></script> <script> $(function () { $(".btn").click(function () { var name=$(".name").val().length; console.log(name); if (name<1){ $(".sname").css("color","red").html("公司名称未输入"); }else{ $(".sname").css("color","red").html("√"); } var linkman=$(".linkman").val().length; console.log(linkman); if (linkman<1){ $(".slinkman").css("color","red").html("公司名称未输入"); }else{ $(".slinkman").css("color","red").html("√"); } var sex=$('input:radio[name="sex"]:checked').val(); if(sex==null){ $(".ssex").css("color","red").html("请选择性别"); } else{ $(".ssex").css("color","red").html("√"); } var number=$(".number").val().length; console.log(number); if(number==11){ $(".snumber").css("color","red").html("√"); }else{ $(".snumber").css("color","red").html("手机号输入不正确"); } var b=$(".email").val().indexOf("@"); console.log(b); if (b!=-1){ $(".semail").text("√").css("color","red"); }else { $(".semail").text("用户名格式不正确").css("color","red"); } var duo=$("input[type='checkbox']").is(":checked"); console.log(duo) if (duo==true){ scheckbox $(".scheckbox").text("√").css("color","red"); }else{ $(".scheckbox").text("最少选择一个").css("color","red"); } }) }) </script> </div> </body> </html>
JQuery判断格式
最新推荐文章于 2021-08-03 18:07:13 发布