时间戳

首页 > 解决方案 > Jquery blur not working when scrolling the page

jquery - Jquery blur not working when scrolling the page

问题描述

I am using jquery blur for error validation.When I am typing on textbox and click outside It's working fine. But When I am scrolling page blur is not triggered.

Look at the jquery example itself https://api.jquery.com/focusout/

When you are on focus on input and scrolling the page it's not focused out or blurred. May I know how to fix this?

标签： jquery

解决方案

blur()没有触发？...自己触发...

在 scroll 上，使用以下方法触发 blur 事件trigger()：

$(document).ready(function() {
  $("#test").on("blur", function() {
    if (isNaN($("#test").val())) {
      $("#test").css("border-color", "red");
      $("#result").html("Expecting numbers");
    }
    else {
      $("#test").css("border-color", "blue");
      $("#result").html("Good input");
    }
  });
  $(this).on("scroll", function() {
    $("#test").blur();
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="test"/>
<p id="result"></p>

<!-- This section has nothing to do ... it just add some content to make the page scrollable -->
<div style="height:99999px; width:200px;">&nbsp;</div>

更多信息可以在这里建立：

trigger()：https ://api.jquery.com/trigger/

scroll()：https ://api.jquery.com/scroll/

推荐阅读