除了单击按钮之外,如何在jQuery中触发模糊?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了除了单击按钮之外,如何在jQuery中触发模糊?相关的知识,希望对你有一定的参考价值。

我有一个包含在jQuery mobile 1.4.5环境中的输入字段,它将向上滚动焦点以在移动设备上提供搜索建议的空间。

enter image description here

填写完场后,它将向下滚动。

$('#refn').on('blur',function(){

  if ( (document.querySelector('.ui-input-clear-hidden') !== null) ) {
    $("html, body").animate({ scrollTop: 0}, 200);
  }

  return false;
});

JQM将在右侧提供明确的链接,这将清除文本字段。这是一个问题,因为点击它会散焦并触发向下滚动功能。导致向下滚动并向上再次起作用。

我试图通过识别类.ui-input-clear-hidden来排除它,但这没有任何效果。我相信,因为它是一个从场上夺走焦点的链接。

<a href="#" tabindex="-1" aria-hidden="true" 
class="
 ui-input-clear 
 ui-btn 
 ui-icon-delete 
 ui-btn-icon-notext 
 ui-corner-all" 
title="Clear text">Clear text</a>

我想仅在未单击清除按钮时才触发该功能。如何才能做到这一点?

答案

如果我明白,问题是当你点击明文按钮时,它会执行你向下滚动的按钮吗?

我认为你可以尝试获得专注的元素,如果它是清晰的按钮,你什么都不做

$('#refn').on('blur',function(){

  var focused_element = document.querySelector(':focus') ; //Get the focused element.
  if ( focused_element.hasClass('.ui-input-clear-hidden') ) {
    //It's the clear button
     return false;
  }else{
     //It's not your clear button
     $("html, body").animate({ scrollTop: 0}, 200);
  }
});

编辑::尝试将您的clear_btn点击存储在var中

//Function to force wait time
function timeout(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}

var clear_btn_clicked = false;

//Event on click
$(document).on("click",function(){
     //You clicked on the X btn
     if( $(this).hasClass('ui-input-clear-hidden' ) ){
         clear_btn_cliked = true;
     }else{
         clear_btn_clicked = false;
     }
});


$('#refn').on('blur',function(){
  await timeout(500); //Wait 0.5s to let JS do the clear_btn click event
  if( clear_btn_clicked === false ){
    $("html, body").animate({ scrollTop: 0}, 200); //You didn't click on the X
  }else{
    return false; //You clicked on the X
  }
});

//You do same for your focus function
 $('#refn').on('focus',function(){
     await timeout(500); //Wait 0.5s to let JS do the clear_btn click event
     if( clear_btn_clicked === false ){
          //Scroll up
     }else{
          //Don't go up
     }
 });

以上是关于除了单击按钮之外,如何在jQuery中触发模糊?的主要内容,如果未能解决你的问题,请参考以下文章

在 JQuery 委托中触发表单提交

直到用户在输入字段之外单击才会触发自动完成 jQuery 更改

单击按钮时如何触发PHP / jQuery [重复]

在jquery中触发按钮单击的所有可能方法

如何调用jquery函数然后触发按钮的点击事件?

XCUITest - 单击后退按钮后,除了睡眠之外,我还能使用啥来在屏幕上查找项目?