Jquery中的函數

Question

我在我的網站中有很多下拉列表，我想用jQuery創建一個可重用的函數，這樣我就可以通過一個函數保存很多代碼。任何一個可以幫助我在這方面... 舉一個例子

<div id="clickMe"> 
    <div id="showMe"> 
     <div>I am dropdown item</div> 
    </div> 
</div> 

現在我使用它像這樣...

$(document).ready(function() { 

    $("#clickMe").click(function(e) {   
     e.preventDefault(); 
     $("#showMe").toggle(); 
     $("#clickMe").toggleClass("menu-open"); 
    }); 

    $("#showMe").mouseup(function() { 
     return false 
    }); 
    $(document).mouseup(function(e) { 
     if($(e.target).parent("#clickMe").length==0) { 
     $("#clickMe").removeClass("menu-open"); 
     $("#showMe").hide(); 
    } 
    }); 
}); 

，但現在我想使它更可重複使用的... 在此先感謝...

Answer 1

您可以使用HTML的class財產與下拉，以確定所有div S，和jQuery的類選擇添加事件偵聽器，例如：

<script type="text/javascript"> 
    //reusable function 
    function addMyListener(){ 
    $(".showClass > div").click(function(){ 
     if($(".showClass").prop("enabled")){ 
      //do some thing while click drop-down item 
     } 
    }); 
    } 

    $(function(){ 
    //call the function while document is ready 
    addMyListener(); 
    }); 
</script> 
<div id="clickMe"> 
    <!-- add class="showDiv" for all showMe like divs --> 
    <div id="showMe" class="showClass"> 
    <div>I am dropdown item</div> 
    </div> 
</div>