让input变成不可编辑状态的方法

本文详细介绍了HTML中input标签的两种属性:disabled和readOnly。通过具体示例展示了这两种属性的效果和区别,帮助读者理解如何使用这些属性来控制网页表单元素的状态。
<input name="ly_qq" type="text" tabindex="2" onMouseOver="this.className='input_1'" onMouseOut="this.className='input_2'" value="123456789" disabled="true" readOnly="true" /> 


disabled="true "此果文字会变成灰色,不可编辑。

readOnly="true" 文字不会变色,也是不可编辑的

转载于 http://blog.163.com/loveyt_happy/blog/static/20159011320124211135248/

<think>我们正在处理一个JSP页面中的需求:当DNSAD参数的值为1时,需要将bsnb字段设为可编辑状态。否则,bsnb字段应该是只读或禁用的。 实现思路: 1. 在JSP页面中,我们可以通过JSTL和EL表达式获取后端传递的DNSAD值。 2. 根据DNSAD的值,动态设置bsnb字段的HTML属性(如readonly或disabled)。 具体步骤: - 首先,确保在JSP页面顶部引入了JSTL核心标签库:<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> - 然后,根据DNSAD的值,使用JSTL的<c:if>或<c:choose>来设置bsnb输入框的属性。 示例代码: 假设我们的bsnb字段是一个输入框,通常情况下它是只读的,但当DNSAD=1时,我们需要移除只读属性(或禁用属性)。 方法一:使用readonly属性 readonly属性使得输入框只能读,但不能修改,且数据会提交。 disabled属性则会使输入框灰显,且数据不会提交。根据需求选择。 这里假设我们希望数据能够提交,所以使用readonly。 代码示例: ```jsp <c:set var="dnsadValue" value="${param.DNSAD}" /> <%-- 假设DNSAD是从请求参数中获取的,如果是域中的属性,可能是${bean.DNSAD} --%> <input type="text" name="bsnb" id="bsnb" <c:if test="${dnsadValue != '1'}">readonly="readonly"</c:if> /> ``` 注意:如果DNSAD是从后端传入的一个对象属性(比如一个Bean),则使用${bean.DNSAD}。 方法二:也可以使用JavaScript在页面加载时动态设置,但考虑到需求简单,且JSP在服务端已经可以获取到值,推荐使用JSTL。 但是,如果DNSAD的值在页面加载后可能会改变(比如通过其他操作改变),那么就需要使用JavaScript来动态改变。不过根据问题描述,我们只需要在页面加载时根据初始值设置。 如果使用disabled属性,注意提交表单时该字段的值不会被包含。如果希望不可编辑但提交,则使用readonly。 另外,如果条件满足(DNSAD=1)时,我们不需要设置readonly,所以使用<c:if>判断当DNSAD不等于1时加上readonly。 或者,我们可以这样写: ```jsp <input type="text" name="bsnb" id="bsnb" ${param.DNSAD eq '1' ? '' : 'readonly="readonly"'} /> ``` 使用EL表达式的三元运算符更简洁。 如果使用disabled: ```jsp <input type="text" name="bsnb" id="bsnb" ${param.DNSAD eq '1' ? '' : 'disabled="disabled"'} /> ``` 注意:disabled的字段在表单提交时不会被发送,所以根据业务需求选择。 如果字段是必填的,但在某些条件下禁用,那么要考虑在服务端处理时,该字段可能不被提交的情况。 因此,通常推荐使用readonly,除非你确定在禁用时不需要该字段的值。 如果需求是DNSAD=1时可编辑,其他情况不可编辑,那么上面的代码即可满足。 扩展:如果除了只读/禁用,还需要改变样式,可以在条件中增加class的设置。 例如: ```jsp <input type="text" name="bsnb" id="bsnb" class="${param.DNSAD eq '1' ? 'editable-class' : 'readonly-class'}" ${param.DNSAD eq '1' ? '' : 'readonly="readonly"'} /> ``` 总结: 根据DNSAD的值,使用EL表达式在渲染页面时动态设置input标签的readonly属性。 注意:确保EL表达式在JSP页面中可用(即页面没有设置isELIgnored="true")。 相关问题: 1. 如何在JSP页面中根据条件设置多个字段的编辑状态? 2. 当DNSAD的值在客户端改变时,如何动态更新bsnb字段的编辑状态? 3. 如何通过JavaScript在JSP页面中获取后端传递的DNSAD值? 4. 使用readonly和disabled属性有什么区别? </think>在JSP页面中实现DNSAD=1时将bsnb字段设为可编辑状态方法如下(推荐使用EL表达式+JSTL): ### 一、后端准备(传递参数) 确保在Controller中将DNSAD值传递到JSP页面: ```java // Spring MVC示例 model.addAttribute("DNSAD", dnsadValue); ``` 或使用传统方式: ```jsp <% request.setAttribute("DNSAD", dnsadValue); %> ``` ### 二、JSP实现方案(三种方式) #### 方法1:直接使用EL表达式(推荐) ```jsp <input type="text" name="bsnb" ${DNSAD eq 1 ? '' : 'readonly="readonly"'} <!-- DNSAD=1时去除readonly属性 --> > ``` #### 方法2:JSTL条件判断 ```jsp <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <input type="text" name="bsnb" <c:if test="${DNSAD ne 1}">readonly</c:if> > ``` #### 方法3:JavaScript动态控制 ```jsp <script> document.addEventListener("DOMContentLoaded", function() { const dnsad = <%= request.getAttribute("DNSAD") %>; // 获取后端值 document.querySelector("[name=bsnb]").readOnly = (dnsad !== 1); }); </script> ``` ### 三、注意事项 1. **数据类型验证**:确保DNSAD是数值类型而非字符串,必要时添加转换: ```jsp <c:set var="numDNSAD" value="${Integer.parseInt(DNSAD)}" /> ``` 2. **样式统一**:建议添加CSS区分状态: ```css input[readonly] { background-color: #f0f0f0; border: 1px dashed #ccc; } ``` 3. **安全考虑**: - 重要字段应增加后端二次验证[^3] - 禁用字段需考虑表单提交策略: ```jsp <input type="hidden" name="bsnb" value="${param.bsnb}"> ``` ### 四、完整示例 ```jsp <%@ page contentType="text/html;charset=UTF-8" %> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <html> <body> <form> <!-- 动态设置bsnb编辑状态 --> BSNB字段: <input type="text" name="bsnb" value="${param.bsnb}" ${DNSAD eq 1 ? '' : 'readonly'}> <!-- 显示DNSAD值辅助调试 --> <div>当前DNSAD值: ${DNSAD}</div> </form> </body> </html> ```
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值