zoukankan      html  css  js  c++  java
  • 表单验证

    <!-- IE上面,对象不支持checkValidity()
    checkValidity() 如果 input 元素中的数据是合法的返回 true,否则返回 false。

    setCustomValidity() 设置 input 元素的 validationMessage 属性,用于自定义错误提示信息的方法。-->

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>javaScript学习</title>
    <link rel="stylesheet" type="text/css" href="css/javascriptstyle.css"/>
    <script>
    function yanz(){
    var x = document.forms["myForm"]["fname"].value;
    var e = document.forms["myForm"]["email"].value;
    var s = document.getElementById("fname");
    var atops = e.indexOf("@");
    var dian = e.lastIndexOf(".");
    if(x==null || x==""){
    s.innerHTML = "需要输入名字";
    // alert("需要输入名字。");
    return false;
    }else{
    s.innerHTML = "";
    }

    //email格式验证
    if(atops<1 || dian<atops+2 || dian+2>=e.length){
    alert("这不是一个有效的e-mail地址");
    return false;
    }

    }
    </script>
    </head>
    <body>
    <form name="myForm" action="javaScript.html" onsubmit="return yanz();" method="post">
    姓名:<input type="text" id="" name="fname"/><span id="fname"></span><br />
    Email:<input type="text" name="email" id="email" value="" required/><span for="email"></span>
    <input type="submit" value="提交"/>
    </form>

    <p>点击按钮,提交表单,如果输入框是空的,浏览器会提示错误信息。</p>
    </body>
    </html>

  • 相关阅读:
    ubuntu 系统命令
    js模板引擎实例一
    读取页面上所有的checkbox
    使用fileReader实现图片预览
    html5中的audio标签针对IOS系统的兼容处理
    CSS单位
    使用变换属性的旋转和动画属性实现大风车效果
    css动画属性--轮播图效果
    php curl详解
    linux权限详解
  • 原文地址:https://www.cnblogs.com/liqiong-web/p/6480582.html
Copyright © 2011-2022 走看看