多个相同name的文本输入框,输入其中一个后,使剩下的不能输入值
可以用blur或keyup事件响应;
实现一:
<body>
<input type="text" id="AfterOtOt1" name="inputovertime" οnkeyup="javascript:check(this);" />
<input type="text" id="AfterOtOt2" name="inputovertime" οnkeyup="javascript:check(this);"/>
<input type="text" id="AfterOtOt3" name="inputovertime" οnkeyup="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>
转载于:https://www.cnblogs.com/shy1766IT/p/4884351.html
多个相同name的文本输入框,输入其中一个后,使剩下的不能输入值相关推荐
- html表格怎么控制文字大小,如何用html设置文本输入框输入字体的大小
HTML中如何设置文本框的大小?你想走,什么时候都可以:你想回来,抱歉,没那个可能. 你说的文本框的大小是指边框的大小吗? 如果是指边框的大小,可以使用CSS样式控制,如: 1content123#t ...
- 【无标题】手写输入文字时,文本框输入最后一个汉字会丢失
@TOC文本框输入最后一个汉字会丢失 手写输入文字时,文本框输入最后一个汉字会丢失 #[报Bug]半屏手写输入文字时,最后一个文字总时需要点击一下才能赋值给v-model 比如说手机端输入的是3个字: ...
- 输入表单输入完一个后按住enter光标自动跳到下一个表单
$.enterfocus = function (selector, callback) { //按住enter键可以自动换到下一行的input var boxArray = [].s ...
- android实现文本输入,Android实现智能提示的文本输入框AutoCompleteTextView
今天我们要讲一个十分简单的内容,就是一个安卓控件的使用,用法很简单,但是很常用的一个.这里我用两种不同的写法来处理.当然,无论用哪一种写法,效果都是一样的. 我们先来看效果图. 要实现这种效果十分简单 ...
- Flutter文本输入框TextField控制器TextEditingController,TextField预设内容,获取TextField中的输入内容,兼听TextField中的内容变化
题记 -- 执剑天涯,从你的点滴积累开始,所及之处,必精益求精. github? 你可能需要 百度同步 CSDN 网易云课堂教程 掘金 知乎 Flutter系列文章 头条同步 本文章首发于微信公众号( ...
- 文本输入框input将输入转换为统一大小写
转载地址:http://blog.csdn.net/yieryi_/article/details/52078596 文本输入框input将输入转换为统一大小写,通常有两种方法:JS和CSS方法. 1 ...
- html文字下排输入,HTML input text单行文本输入框简介说明
摘要: 下文讲述html代码中input type='text'时的相关属性简介说明,如下所示: input type='text' 简介 当 input标签中 type='text'时,代表此标签是 ...
- html ip输入框效果,html5 input文本框输入动画特效
特效描述:文本框输入动画 动画特效.几个更鼓舞人心的风格为文本框输入动画包括一些新技术和新思想. 代码结构 1. 引入CSS 2. 引入JS 3. HTML代码 Manami Username Web ...
- Qt自定义文本输入框实现支持输入度分秒和度两种格式(简易无限制输入)
1.自定义文本输入框 #ifndef MYLINEEDIT_H #define MYLINEEDIT_H#include <QLineEdit> #include "ui_myl ...
- jquery仿邮箱文本输入框自动加载邮箱后缀
jquery仿邮箱文本输入框自动加载邮箱后缀 在像百度这样的网站注册时,你会看到输入邮箱会出现自动给用户输入补全主流邮箱.这种对于增加用户体验的小例子已司空见惯.正好看到人家写的这种js功能.还挺不错 ...
最新文章
- 设计中涉及到的dip、dp、px、sp等单位说明
- SQL中 char、varchar、text 和 nchar、nvarchar、ntext的区别
- 将Session写入Memcache
- 伪原创工具安全第一嘛~~
- K-近邻算法(KNN)概述
- Nginx 负载均衡 配置全过程
- Git:git合并分支
- 华为服务器voip处理性能,voip云服务器注册状态
- python snownlp_snownlp · PyPI
- PowerDesigner将PDM导出生成WORD文档(rtf文档)
- 怎样清理计算机c盘东西,电脑c盘满了怎么清理
- 呆萝卜 竞品分析报告
- 怎么知道网站是否被黑 服务器是否被入侵呢
- word保留格式简体转换成繁体宏
- 【神经网络与深度学习】1.线性分类与感知机
- 2012计算机科学排名,USnews2012美国大学排名计算机科学专业排名
- 使用Karabiner为Mac内置键盘、HHKB进行映射
- 2019第十一周作业
- Pandas Task6——综合练习
- apk瘦身 提高优化效果
热门文章
- 英语中的完成时态的比较
- (转)log4j(二)——如何控制日志信息的输出?
- 20170216--PYthon 类 +面向对象编程+(文件的处理+echo小程序的实现)
- RHEL4-VNC服务(二)vnc服务器的配置
- JAVA 基础语法(四)——循环结构(while,do...while,for,break,continue)
- 忍者神龟java_忍者神龟-邪恶重生
- 第一部分 第二章 答案合集(part 1)1006-1023
- (详解)无指针AC自动机
- redux-chunk中间件的安装和使用-(二)
- js函数内部定义函数的理解