表单提交

1.使用button提交

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>提交表单</title>
    <script type="text/javascript">
        function submits(){
            //获取form标签
            var form = document.getElementById("form1");
            //设置提交地址
            form.action = "http://www.baidu.com";
            //提交表单数据
            form.submit();
        }
    </script>
</head>
<body>
    <form id="form1">
        <input type="text" name="username">
        <br/>
        <input type="button" value="提交" onclick="submits();">
    </form>
</body>
</html>

2.使用超链接提交表单

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>超链接提交表单</title>
</head>
<body>
    <form id="form1">
        <input type="text" name="username">
        <br/>
        <!-- 
            href:?前的参数是提交地址
            ?后的参数,将文本输入框的内容写在这
         -->
        <a href="http://www.baidu.com?username=大多数都比我强">我也知道我平凡</a>
    </form>
</body>
</html>

3.onfocus和onblur

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>得到焦点/失去焦点</title>
    <script type="text/javascript">
        function focus(){
            var focus = document.getElementById("username");
            focus.value ="";
        }
        function blurs(){
            var blur = document.getElementById("username");
            blur.value = "please input";
        }
    </script>
</head>
<body>
    <input type="text" id="username" value="" onfocus="focus();" onblur="blurs();">
</body>
</html>

失去焦点:

 

posted @ 2019-02-28 09:31  静心*尽力  阅读(135)  评论(0)  编辑  收藏  举报