如何用類而不是id打開jQuery對話框？

Question

我在頁面上有很多鏈接，我只需要打開幾個jQuery對話框。我如何使用類而不是ID打開它們？

這裏是我的腳本：

<script> 
    // increase the default animation speed to exaggerate the effect 
    $.fx.speeds._default = 1000; 
    $(function() { 
     $("#selectFolder").dialog({position:['middle',60],   
      open: function(event, ui) { 
      jQuery('.ui-dialog-titlebar-close').removeClass("ui-dialog-titlebar-close").html('<span style="float:right;"><img src="../images/x.png" /></span>'); 
     }, 
      dialogClass: 'ui-widget-shadow', 
      modal: true,  
      autoOpen: false, 
      width: '650px', 
      close: function(ev, ui) {$(this).close();}  
     }); 

     $("#selectFolderOpen").click(function() { 
      $("#selectFolder").dialog("open"); 
      return false; 
     }); 
    }); 
    </script> 
<div style="display:none;"> 
    <div id="selectFolder" title="Select Folder"> 
     <div style="display:block;"> 
      <!--#include file="sidebar_modal_questions_folder_select.asp"--> 
     </div> 
    </div> 
</div> 

這裏可以讓你對工作的例子：我希望它是這樣工作

<a href="#" class="buttonintable" id="selectFolderOpen">Select Folder</a> 

：

<a href="#" class="buttonintable selectFolderOpen">Select Folder</a> 

這樣我不必爲每個我希望打開的鏈接編號。

我知道你對一個類使用（'#selector'）和id和（'.selector'） - 但我無法讓它工作。任何幫助？

Answer 1

您的選擇更改爲$('.selectFolderOpen').click(...)

jQuery選擇可以選擇任何東西，你將能夠在一個CSS選擇器的目標。它使用#來表示一個id，並使用.（點）來表示一個類。

Answer 2

我回答了我自己的問題。這裏是工作代碼：

<script> 
// increase the default animation speed to exaggerate the effect 
$.fx.speeds._default = 1000; 
$(function() { 
    $("#selectFolder").dialog({position:['middle',60],   
     open: function(event, ui) { 
     jQuery('.ui-dialog-titlebar-close').removeClass("ui-dialog-titlebar-close").html('<span style="float:right;"><img src="../images/x.png" /></span>'); 
    }, 
     dialogClass: 'ui-widget-shadow', 
     modal: true,  
     autoOpen: false, 
     width: '650px', 
     close: function(ev, ui) {$(this).close();}  
    }); 

    $("a.selectFolderOpen").click(function() { 
     $("#selectFolder").dialog("open"); 
     return false; 
    }); 
}); 
</script> 

與火了：

<a href="#" class="buttonintable selectFolderOpen">Select Folder</a> 

Answer 3

下面是一個例子：http://jsfiddle.net/WVVXy/

$(function() { 
    $("a.buttonintable").click(function() { 
    $(this).dialog(); 
    return false; 
    }); 
});