2017-03-24 13 views
1

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>

+0

グループ1 http://stackoverflow.com/questions/1259716/how-to-blur-the-div-element – Satpal

+0

を参照し、2人の兄弟ではなく、親です - >子 –

答えて

0

私は完全にあなたの質問を理解することはできないけど、あなたは、私は次のコードを書いていますグループ2にグループ1から変更した場合の検証のいくつかのフォームを持っているしたいと仮定します。次のスニペットは、必要に応じてカスタマイズできる一般的な形式です。

   <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> 
関連する問題