Question

有人可以解释一下这段代码将如何运作

因为，我不知道是否应该将代码放在插件文件中或离开页面

我还需要注意什么

代码来自http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/datePickerCloseMouseOut.html

提前感谢，理查德

（另外，我不知道wat cal是指，datePickerDiv和$（'。date-pick'）？）

 $(function() 
{ 
   var cal; 
   var $this; 

   var checkForMouseout = function(event) 
   { 
      var el = event.target; 

      while (true){ 
         if (el == cal) { 
            return true; 
         } else if (el == document) { 
            $this.dpClose(); 
            return false; 
         } else { 
            el = $(el).parent()[0]; 
         } 
      } 
   }; 

   $('.date-pick') 
      .datePicker() 
      .bind( 
         'dpDisplayed', 
         function(event, datePickerDiv) 
         { 
            cal = datePickerDiv; 
            $this = $(this); 
            $(document).bind( 
               'mouseover', 
               checkForMouseout 
            ); 
         } 
      ).bind( 
         'dpClosed', 
         function(event, selected) 
         { 
            $(document).unbind( 
               'mouseover', 
               checkForMouseout 
            ); 
         } 
      ); 

});

Answer 1

此代码将检查鼠标是否离开datepicker div，然后如果鼠标离开则关闭它。代码通过检查接收事件的元素是否为日历来检查这一点。

//el is set above or below, call is set globally in the document.ready
while (true){ //this will loop forever until a return
     if (el == cal) { //is the receiving element the calender
        return true; //we return true (no ideo why true and not null or 'yaadada'
     } else if (el == document) { //we check if the target el is the document
        $this.dpClose();  //close the element
        return false; //return to leave loop
     } else { //el is neither the call or the document
        el = $(el).parent()[0]; //set el to the imidiate parent of the current el and reloop
     }
}

您应该将此代码放在文档的头部。

这个代码更容易：

$('.date-pick') 
  .datePicker() 
  .bind( 
     'dpDisplayed', 
     function(event, datePickerDiv) 
     { 
        cal = datePickerDiv; //datepickerdiv should somehow hold the the datpicker div , something like: $('.date-pick')[0];
        $this = $(this); 
        $(cal).mouseleave( function() { $(this).dpClose(); });
     }
}

更好的问题可能是，为什么你不想包含你不知道它的代码？

注意：此代码非常难看，您应该考虑重写它。

datepicker上的事件mouseout

1 个答案: