onmousedown、onmouseup和onclick的奇怪问题

将setTimeout的时间设置为0,告诉浏览器当它为当前任何挂起的事件运行完事件句柄并且完成了文档当前状态的更新后,就调用该函数,于是可用下面的例子来看效果:

<script>

function createinput(){

         var input = document.createElement('input');
   
         input.setAttribute('type', 'text');
   
         input.setAttribute('value', 'test1');
   
         document.getElementById('inpwrapper').appendChild(input);
   
         input.focus();
   
         input.select();

    }

function createinput1(){

         var input = document.createElement('input');
   
         input.setAttribute('type', 'text');
   
         input.setAttribute('value', 'test1');
   
         document.getElementById('inpwrapper').appendChild(input);
   
     setTimeout(function(){

      input.focus();

      input.select();

     }, 0);

    }

</script>

<form name="navbar">

  <button id="makeinput" οnmοusedοwn="createinput()" create input</button>
  <p id="inpwrapper"></p>

</form>

 由于js执行是单线程的,当执行完鼠标按下的事件处理函数后会丢掉事件句柄链,所以用createinput函数不会使新创建的text聚焦,然而使用setTimeout方法后会告诉浏览器尽快执行它所指定的函数,所以用createinput1函数会使新创建的text聚焦。

 

问题1:但是当使用的是οnmοuseup="createinput()" 或者οnclick="createinput()" 时,并不需要用setTimeout就可以让浏览器直接调用input.focus(); input.select();这又该如何解释呢??

问题2:当在onmousedown中调用createinput()前先调用alert()事件时,input.focus(); input.select();这两个方法会被浏览器调用,然而,如果该按钮同时注册了onmouseup或onclick的话是不会被触发的(在onmouseup和onclick中调用alert也一样,因为alert会阻止了事件传递,即后续调用事件丢失)

 

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值