如何捕获父元素中的模糊事件

时间:2017-03-24 17:03:14

标签: javascript jquery onblur

我想实现这一点,当我从group1输入移动到group2输入时,会捕获模糊事件,因此我可以进行其他操作。是不是模糊事件传播到父母的上层?



<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<html>
  <head>     
    <script type="text/javascript">
     $( document ).ready(function() {
       $("[data-id=container]").on("blur", function() {
         alert("Blur caught in parent");
       });
     });
    </script>
  </head>
  <body>
    <div data-id="container" style="border: 1px solid gray;">
       Group 1        
      <input type="text" />
      <input type="text" />
      <input type="text" />
    </div>
    <div data-id="container" style="border: 1px solid gray;">  
      Group 2      
      <input type="text" />
      <input type="text" />
      <input type="text" />
    </div>
  </body>
</html>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

我无法完全理解您的问题,但假设您希望在从第1组更改为第2组时进行某种形式的验证,我将编写以下代码。以下代码段是一般表单,您可以根据需要进行自定义。

                <input type="text" id="one" onblur="validate">
                <input type="text" id="two" onblur="validate">
                <input type="text" id="three" onblur="validate">
                <script type="text/javascript>
                    function validate()
                    {
                        var a = document.getElementById("one");
                        var b = document.getElementById("two");
                        var c = document.getElementById("three");
                        if (b.hasFocus() == true) //checks if the second input box has focus
                        {
                            alert("Value of the focused field is "+a.value); //this will give you the value in the first input box
                        }
                        else if (c.hasFocus() == true) //checks if the third input box has focus
                        {
                            a.focus(); //this will get the focus back on the first input box
                        }
                    }

                </script>