0

異なるセレクターの機能を組み合わせる方法を知りたいです。すべての関数はダイアログを開いたり閉じたりしますが、ダイアログは異なります。なので、可能かどうかはわかりません。間違っているように見えるだけで、誰かがそれを見たら、彼らは私を馬鹿と呼ぶでしょう. 今私は持っています：

$(document).ready(function() {
    $('div#basic_dialog').dialog({
        autoOpen: false,
        buttons: {
            "Close": function () {
                $('div#basic_dialog').dialog("close");
                window.location.href = "#contact";
            }
        }
    })
    $('#basic_dialog_button').click(function(){ $('div#basic_dialog').dialog('open'); });
    $('div#caption_dialog').dialog({
        autoOpen: false,
        buttons: {
            "Close": function () {
                $('div#caption_dialog').dialog("close");
                window.location.href = "#contact";
    }
    }
    })
 $('#caption_dialog_button').click(function(){ $('div#caption_dialog').dialog('open'); });
    $('div#plus_dialog').dialog({
    autoOpen: false,
    buttons: {
        "Close": function () {
                $('div#plus_dialog').dialog("close");
        window.location.href = "#contact";
    }
    }
    })
$('#plus_dialog_button').click(function(){ $('div#plus_dialog').dialog('open'); });
$('div#skills_dialog').dialog({
    autoOpen: false,
    buttons: {
    "Close": function () {
        $('div#skills_dialog').dialog("close");
        window.location.href = "#contact";
    }
    }
})
$('#skills_dialog_button').click(function(){ $('div#skills_dialog').dialog('open'); });
})

しかし、私はそれが何らかの形で美化できると確信しています。それらはすべて異なるボックスを開閉するので、わかりません。それらがすべてまったく同じ機能を実行している場合、私はそれを行う方法を知っていますが、その変更をマッピングすることは今のところ私にはできません.

4

3 に答える 3

1

単一の結果に結合するセレクターをいくつでも指定できます。次のように使用できます。

$(document).ready(function() {
        $('div#basic_dialog,div#caption_dialog,div#plus_dialog,div#skills_dialog').dialog({
            autoOpen: false,
            buttons: {
                "Close": function() {
                    $('div#basic_dialog').dialog("close");
                    window.location.href = "#contact";
                }
            }
        })
        $('#basic_dialog_button,#caption_dialog_button,#plus_dialog_button,#skills_dialog_button').click(function() {
            $('div#basic_dialog').dialog('open');
        });
    })

編集
済みクリック可能な各要素に共通のクラスを与え、以下のように使用できます。

            $('.dialog_button').click(function() {
                $(this).dialog('open');
            });
于 2012-10-04T04:56:11.823 に答える
1

複数のセレクターをコンマで区切って一度に使用できます。

$('div#basic_dialog, div#caption_dialog, etc...')

ただし、あなたのような場合は、代わりにクラスを使用することをお勧めします。

于 2012-10-04T04:41:36.813 に答える
0

古い質問を再検討し、これを永遠に行った後、今何ができるでしょうか:

$(function(){
    var close = function(){
        $(this).dialog("close");
        window.location.href = "#contact";});

    $(".dialog").dialog({
        autoOpen: false,
        buttons: {
            "Close": close
        }});

    $(".dialog-button").click(function(){
        var db = $(this).attr("data-val");
        $("#"+db).dialog('open');});
});

次に、クラス .dialog をすべてのダイアログ要素と一意の ID に追加します。ボタン ハンドラーには、それが制御するダイアログの ID をデータ属性として追加します。この方法の利点は、これらを var として設定し、さらにダイアログを動的に作成した後に関数を実行することもでき (必要な場合)、DOM でまだ作成されていない要素にダイアログ機能を追加し続けることができることです。ボタン ハンドラーの ID をデータ属性として追加する別の js 関数も使用する必要がある場合。

私にとって魅力のように機能し、この時点で得られるのと同じくらいきれいです. これを改善できる人をまだ探しています。

于 2013-06-02T20:08:51.603 に答える