当前位置: article > 正文

Js 最原始的表单验证 |将数据提交到百度搜索_怎么让提交按钮获取到表单内容然后百度出来呢

作者：小丑西瓜9 | 2024-02-18 21:50:17

踩

怎么让提交按钮获取到表单内容然后百度出来呢


<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
</head>
<body>
    <!--注意是在form1中假如一个onsubmit事件-->
    <!--onsubmit：事件名，表示表单提交的时候所触发的事件。如果checkForm()这个函数返回一个true表示表单都验证通过了，事件继续，如果返回false的话 οnsubmit=false的时候表单不会被提交，即事件终止-->
    <form name="form1" οnsubmit="return checkForm()">
        <table style="margin:20px auto">
            <tr><td>用户名：</td><td><input name="txtUserName" id="txtUserName" type="text" /></td></tr>
            <tr><td>密码：</td><td><input name="txtPwd" type="text" /></td></tr>
            <tr><td>手机：</td><td><input name="txtPhome" type="text" /></td></tr>
            <tr><td>邮箱：</td><td><input name="txtEmail" id="txtEmail" /></td></tr>
            <tr><td>年龄：</td><td><input name="txtAge" id="txtEmail" /></td></tr>
 
            <tr><td></td><td><input type="submit" value="提交" /></td></tr>
        </table>
    </form>
</body>
</html>
<script type="text/javascript">
    function checkForm() {
        if (document.form1.txtUserName.value == "")
        {
            alert("用户名不能为空！")
            return false
        }
        if (document.form1.txtUserName.value.length < 2 || document.form1.txtUserName.value.length > 100)
        {
            alert("用户名不规范！")
            return false;
        }
 
        if (document.form1.txtAge.value != "") {
            var reg = new RegExp("^1{0,1}[0-9]{1,2}$");           
            reg = /^1{0,1}[0-9]{1,2}$/gi;
 
            //或者直接这样写：var reg=/在这里面写正则/gi; (注意以gi结尾)   例如:var reg=/^1{0,1}[0-9]{1,2}$/gi;
 
            var v = document.form1.txtAge.value;
            if (!reg.test(v)) {
                alert("年龄输入不正确")
            }
        }
        else { alert("年龄不能为空") };
        return true;
    }
</script>

将数据提交到百度搜索


<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<body>
    <form action="http://www.baidu.com/s">
        <input type="text"  name="wd" value=""/>
        <input type="submit"value="百度一下" />
    </form>
</body>
</html>

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/小丑西瓜9/article/detail/110777