多个相同name的文本输入框，输入其中一个后，使剩下的不能输入值
可以用blur或keyup事件响应；
实现一：
<body>
<input type="text" id="AfterOtOt1" name="inputovertime" onkeyup="javascript:check(this);" />
<input type="text" id="AfterOtOt2" name="inputovertime" onkeyup="javascript:check(this);"/>
<input type="text" id="AfterOtOt3" name="inputovertime" onkeyup="javascript:check(this);" value="123"/>
<input type="text" id="AfterOtOt4" />
</body>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function() {
$("input[name=inputovertime]").each(function(index, content) {
if ($(content).val() == "" || $(content).val() == null) {
$(content).attr("disabled", "disabled"); //不可编辑
}
})
})
function check(obj){
if($(obj).val()!=""){
$("input[name=inputovertime]").each(function (index, content) {
if(obj!=content){ //如果name=inputovertime的input元素中不是当前已输入值的对象
$(content).attr("disabled", "disabled"); //不可编辑
}
})
}else{
$("input[name=inputovertime]").each(function (index, content) {
$(content).removeAttr("disabled"); //初始化未输入时可编辑
})
}
}
</script>
实现二：
<body>
<input type="text" id="AfterOtOt1" name="inputovertime"/>
<input type="text" id="AfterOtOt2" name="inputovertime"/>
<input type="text" id="AfterOtOt3" name="inputovertime" value="123"/>
<input type="text" id="AfterOtOt4" />
</body>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function () {
$("input[name=inputovertime]").each(function(index,content){
if($(content).val()==""||$(content).val()==null){
$(content).attr("disabled", "disabled"); //不可编辑
}
})
$("input[name=inputovertime]").keyup(function () {
if ($(this).val().length > 0) {
$(this).siblings("input[name=inputovertime]").attr('disabled', "disabled");//将除当前name=inputovertime输入值外的name为未输入值的input元素设置为disabled;
}
else {
$(this).siblings("input[name=inputovertime]").removeAttr('disabled'); // 将除当前name=inputovertime的未输入值的name=inputovertime的input元素设置为可编辑;
}
})
})
</script>
多个相同name的文本输入框，输入其中一个后，使剩下的不能输入值的更多相关文章
- 解决Vue中文本输入框v-model双向绑定后数据不显示的问题
前言 项目中遇到一个问题就是在Vue中双向绑定对象属性时,手动赋值属性后输入框的数据不实时更新的问题. <FormItem label="地址" prop="eve ...
- 文本输入框input将输入转换为统一大小写
转载地址:http://blog.csdn.net/yieryi_/article/details/52078596 文本输入框input将输入转换为统一大小写,通常有两种方法:JS和CSS方法. 1 ...
- html禁止文本输入框记录输入记录，单击input出现输入过的记录
其实方法很简单,只需要在input文本输入框中加一条autocomplete="off"属性即可. <input type="text" name=&qu ...
- Qt自定义文本输入框实现支持输入度分秒和度两种格式(简易无限制输入)
1.自定义文本输入框 #ifndef MYLINEEDIT_H #define MYLINEEDIT_H #include <QLineEdit> #include "ui_my ...
- Text input(文本输入框)
Text input(文本输入框)是用来获得用户输入的绝佳方式. 你可以用如下方法创建: <input type="text"> 注意,input元素是自关闭的.
- JS 文本输入框放大镜效果
JS 文本输入框放大镜效果 今天下午研究了下 "文本输入框放大镜效果" 当然KISSY官网也有这种组件 请看kissy demo 其实这种效果 对于很多童鞋来说 应该并不陌生!我今 ...
- HTML中<input>參数，以及文本输入框，文本域的解说
<form> <input type="text/password" name="名称" value="文本" /> ...
- Python实现使用tkinter弹出输入框输入数字, 具有确定输入和清除功能
Python3.6中用tkinter, 弹出可以输入数字的输入框. # Copyright (c) 2017-7-21 ZhengPeng All rights reserved. def pop_u ...
- 实时监听文本框输入 oninput、onchange与onpropertychange事件的用法和区别
前端页面开发的很多情况下都需要实时监听文本框输入,比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数.过去一般都使用onchange/onkeyup/onkeypress/onke ...
随机推荐
- Android开发之 adb 启动问题或是部署应用不成功，出现“The connection to adb is down, and a severe error has occured.”错误
首先是今天想测试下应用,没有问题的话就进行下一步的操作来着,结果遇到这个问题, The connection to adb is down, and a severe error has occure ...
- QQ JS省市区三级联动
如下图: 首先写一个静态的页面: <!DOCTYPE html> <html> <head> <title>QQ JS省市区三级联动</title ...
- Linux 常用命令行
Linux常用命令行 第一部分: cd命令 第二部分:文件操作 第三部分:压缩包操作
- JavaScript中的直接量与初始器的区别
很多代码优化及公司规范都会提到 写对象不应该 var obj = new Object() 而应该 var obj = {} 写数组不应该 var arr = new Array() 而应该 var ...
- 02_嵌套矩形(DAG最长路问题)
来源:刘汝佳<算法竞赛入门经典--训练指南> P60 问题2: 问题描述:有n个矩形,每个矩形可以用两个整数a,b描述,表示它们的长和宽.矩形X(a,b)可以嵌套在矩形Y(c,d)中的条件 ...
- xamarin.android 图片高斯模糊效果
代码如下: private static float BITMAP_SCALE = 0.1f; private static float BLUR_RADIUS = 12.0f; public sta ...
- top命令使用详解
1.top命令查看服务器负载情况,CPU使用率,进程数等信息. 0.0% wa IO等待占用CPU的百分比 86.9% id 表示空闲的CPU占比 load average数据是每隔5秒钟检查一次活 ...
- css reset重置样式有那么重要吗？
在以前写html代码的时候,一般都会在head里添加重置样式reset.css,其内容如下: @charset "utf-8"; html, body, div, span, ap ...
- javascript编程习惯总结
总结一下javascript需要注意的一些细节的地方: 1:声明一个对象:var a={ }; 2:另一个对象继承一个对象:Var b=Object.create(a);如果父类的属性和方法发生改变, ...
- 转: EclipseIDE开发 for C++
Eclipse 开发C++ 程序 http://tangmingjie2009.iteye.com/blog/2088363 Eclipse 开发C++ 程序 (二) 静态库 http://tangm ...