3

いくつかの 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>

そうすれば、開きたいすべてのリンクにIDを付ける必要はありません。

クラスに ('#selector') と id および ('.selector') を使用していることは知っていますが、それを機能させることはできません。何か助けはありますか？

4

3 に答える 3

2

セレクターを次のように変更します$('.selectFolderOpen').click(...)

jQuery セレクターは、CSS セレクターでターゲットにできるものなら何でも選択できます。#ID を表すために使用し.、クラスを表すために (ドット) を使用します。

于 2013-01-10T17:36:02.100 に答える
1

次に例を示します：http：//jsfiddle.net/WVVXy/

$(function () {
  $("a.buttonintable").click(function () {
    $(this).dialog();
    return false;
  });
});
于 2013-01-10T17:46:24.120 に答える
0

私は自分の質問に答えました。作業コードは次のとおりです。

<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>
于 2013-01-10T17:38:04.500 に答える