zoukankan      html  css  js  c++  java
  • 自动切换焦点

    在看书,发现越到后面例子越多。怕自己记不住,就写下来

    我是美美demo

    原理是触发事件时,找到事件发生的表单元素,注意表单字段其实是指表单元素,如<input>,<lable>等。别以为写在form里就是表单字段了如<div><p>就不是表单字段啦,是不会自在form.length里面的。遍历表单字段,找到当前操作的元素,使其下一元素(i+1)聚焦。返回

    <form action="www.beihai365.com" method="get" id="form1">
        <p>
        	<input type="text" id="text1" name="iphone" maxlength="3" />
            <input type="text" id="text2" name="iphone" maxlength="3" />
            <input type="text" id="text3" name="iphone" maxlength="3" />
        </p>
    </form>
    

      以下是js

    	/*自动获得焦点*/
    	function tabForward(event){
    		var e=EventUtil.getEvent(event);//获得event对象
    		var target=EventUtil.getTarget(e);//获得事件的目标。
    		if(target.value.length == target.maxLength){//判断输入的长度是否与最大长度相等。
    			var iphone=target.form.elements['iphone'];//找到当前表单要跳转的那个些同名input。
    			for( var i=0 , len=iphone.length ; i<len ; i++ ){
    				if( iphone[i] == target ){//如果同名input有某个正触发事件,即前面判断的到达最大长度
    					iphone[i+1].focus();//则让下一个聚焦
    					return;
    				}
    			}
    		}
    	}
    	EventUtil.addHandler($('text1'),'keyup',tabForward);
    	EventUtil.addHandler($('text2'),'keyup',tabForward);//不能再给第三个添加了。后面没有表单元素,会报错的。
    

      

  • 相关阅读:
    IntellJ IDEA 使用技巧之组件窗口设置
    记springboot + MP +Hikari动态数据源配置
    manjaro升级后_sogou输入法异常
    python_mysql库安装问题
    通讯录制作(.csv文件转.vcf文件即vcard格式)
    win10_bat _运行python程序
    yield()返回参数函数使用
    python交换两个整型数据的数值
    Mongodb 4.0+安装
    C# winform 记住密码实现代码
  • 原文地址:https://www.cnblogs.com/ihqn19/p/3171803.html
Copyright © 2011-2022 走看看