当前位置： 移动技术网 > IT编程>开发语言>Java > JavaWeb学习日记----XML

JavaWeb学习日记----XML

2019年04月03日  | 移动技术网IT编程  | 我要评论

兴奋坠饰,郎溪县,猎与杀

1.表单提交方式

　　(1) 使用input控件中的submit提交

　　　　代码如下：

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>title</title>
</head>
<body>
<form action="#" method="get">
用户：<input type="text" name="user" id="user"/><br/>
密码：<input type="password" name="password" id="password"/><br/>
<input type="submit"/>
<input type="reset"/>
</form>
</body>
</html>

结果：

 上图是通过get方法使用input控件中的submit的表单提交方式

　　(2)使用button提交表单

　　　　步骤：

　　　　　　通过id获取form标签

　　　　　　设置action(要提交的页面)

　　　　　　调用submit()方法提交form表单

　　代码如下：

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>title</title>
    <script type="text/javascript">
        function submit1(){
            var myform = document.getelementbyid('myform');//获取到form
            myform.action='#';
            myform.method='get';
            myform.submit();
        }
    </script>
</head>
<body>
<form action="#" method="get" id="myform">
用户：<input type="text" name="user" id="user"/><br/>
密码：<input type="password" name="password" id="password"/><br/>
<input type="button" value="我是提交按钮" onclick="submit1();"/>
<input type="reset"/>
</form>
</body>
</html>

结果：

如上所示,在button中添加鼠标点击事件，通过javascript中获得form对象，调用submit()方法实现表单的提交

(3)使用超链接提交

　　格式： <a href='' 要提交的页面 ？ 参数的键值对''><a/>

<a href="# ? user=admin,password=admin">点我提交</a>

结果：

补充知识点：

以后的学习中可能会遇到的事件：

　　onfocus:得到焦点

　　onblur:失去焦点

通过上面两个事件可以实现文本框内默认文本不消失的效果

示例：

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>title</title>
    <script type="text/javascript">
        function getmouse(){
            var username = document.getelementbyid('user');
            username.value="";
        }
        function losemouse() {
            var username= document.getelementbyid('user');
            username.value='请输入用户名';
        }
    </script>
</head>
<body>
<form action="#" method="get" id="myform">
用户：<input type="text" name="user" id="user" value="请输入用户名" onfocus="getmouse();" onblur="losemouse();"/><br/>
密码：<input type="password" name="password"  id="password" /><br/>
<input type="button" value="我是提交按钮" onclick="submit1();"/>
<input type="reset"/>
</form>
</body>
</html>

 

当用户名输入框未获得焦点(鼠标）时,文本框默认显示"请输入用户名"

当输入框获得焦点时，文本框显示如下

当输入框再次失去焦点时，又会显示默认文本：

以上就是javaweb学习日记第一天内容.

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网