码迷,mamicode.com
首页 > Web开发 > 详细

web基础----->readonly与disabled的区别

时间:2016-06-02 18:08:41      阅读:249      评论:0      收藏:0      [点我收藏+]

标签:

  readonly和Disabled是用在表单中的两个属性,它们都能够做到使用户不能够更改表单域中的内容。但是它们之间有着微小的差别,今天我们通过案例来学习一下。

readonly和Disabled的区别

一、 我们在index2.jsp中加入以下代码:

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<script type="text/javascript">
    function enabled() {
        document.myform.username.disabled = false;
    };
    function readonly() {
        document.myform.password.readOnly = false;
    };
</script>
</head>
<body>
<form action="servlet/LoginServlet" method="get" name="myform">
    username: <input type="text" value="Linux" name="username" disabled="disabled" /> <br>
    password: <input type="text"  name="password" value="123456"  readonly="readonly" > <br>   
    age: <input type="text" value="22" name="age" /> <br>
    address: <input type="hidden" value="china" name="address" /> <br>
    <input type="submit" value="submit"> 
</form>
    <button onclick="readonly()">readonly</button>
    <button onclick="enabled()">enabled</button>
</body>
</html>

注意document.myform.password.readOnly的only中的o是大写的,如果小写则没有效果。

 

二、 在servlet中仅仅是获取数据操作

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    String username = request.getParameter("username");
    response.getWriter().println("username: " + username);
    
    String age = request.getParameter("age");
    response.getWriter().println("age: " + age);
    
    String password = request.getParameter("password");
    response.getWriter().println("password: " + password);
    
    String address = request.getParameter("address");
    response.getWriter().println("address: " + address);
}

 

三、 运行效果如下:

技术分享

 

 四、 总结readonly、disbled和hidden

  • readonly只针对input和textarea有效,而disabled对于所有的表单元素都有效,包括select, radio, checkbox, button等。
  • 表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去,而readonly和hidden会将该值传递出去
  • 两者的数值改变,只能通过script脚本。

详情请参见w3c文档:https://www.w3.org/TR/REC-html40/interact/forms.html#h-17.12

 

web基础----->readonly与disabled的区别

标签:

原文地址:http://www.cnblogs.com/huhx/p/webDisabledReaonly.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!