zoukankan      html  css  js  c++  java
  • 多个相同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>
  • 相关阅读:
    Qt 配置fakevim
    CentOS安装Ruby组件
    Linux shell 操作 postgresql,并设置crontab任务
    修改win7锁定界面背景
    Ubuntu安装Redis
    Java 向SQL Server插入文件数据
    用VMware vSphere Client客户端登陆vsphere5提示错误
    DD应用实例
    shell初学
    deepin2014.1快捷键
  • 原文地址:https://www.cnblogs.com/shy1766IT/p/4884351.html
Copyright © 2011-2022 走看看