0

モーダル ダイアログ ボックスを開くアプリケーションで作業しています。ダイアログ ボックスを使用すると、ユーザーは、表示されているモーダル ダイアログ div に基準などのチェックボックスを追加できます。チェックボックスのテキストをページのテキストボックスに入力し、ボタンをクリックしてチェックボックスを追加します。チェックボックスは問題なく表示されます。各チェックボックスの横に、jquery ui-icon icon-close イメージ クラスも追加して、新しいエントリの横にある X をクリックするとエントリがページから削除されるようにします。

問題は、ページでスクリプトを指定しただけでは機能しないという事実にあります。div はページの一部ではないようであり、すべての画像に対して onclick リスナーを定義しても、想定どおりに動作しません。私の質問は、モーダル ダイアログ内で画像の onclick リスナーを定義するにはどうすればよいかということです。たとえば、モーダル ダイアログ ボックスを定義する際に、ダイアログ ボックスが最初に開かれたときに何かを実行する on open 関数を指定できます。同様の方法で、モーダル ダイアログ ボックス内で画像がクリックされるたびにアクティブにリッスンする関数を定義したいと考えています。

例：

        $("<div class='rationale' style='position: relative;'><div class='rationaleContainer' style='display:block; height:155px; overflow-y: scroll;'></div><div class='rationaleText' style='position: absolute; bottom: 0; float: right;'><input type='text' placeholder='Add rationale' id='rationaleBox' style='width: 540px;' maxlength='180'></div></div>").dialog({
        height: 300,
        width: 600,
        modal: true,
        closeOnEscape: false,
        resizable: false,
        title: "Comments for " + item,
        open: function(event, ui){
            $(".ui-dialog-titlebar-close").hide();
            $(".ui-dialog-title").after("<i style='font-size: 12px; float: right;'>("+value+")</i>");
            $(".ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset").css("float", "none");
        },

定義されている open 関数と同様に、画像クリックのリスナーを作成したい

4

1 に答える 1

0

要素がクリックされたときにリッスンするグローバル ハンドラーを定義するには、onjQuery 1.7 以降で関数を使用します。例えば：

$(document).ready(function() {
    $('.ui-dialog .icon-close').on('click', function() {
        // an element of *.icon-close* within *.ui-dialog*
        // had been clicked
        $('ui-dialog').hide();
    });
});

1.7 より前のバージョンの jQuery を使用している場合は、delegate代わりに次のonように使用します。

$(document).ready(function() {
    $('.ui-dialog .icon-close').delegate('', 'click', function() {
        // an element of *.icon-close* within *.ui-dialog*
        // had been clicked
        $('ui-dialog').hide();
    });
});
于 2012-06-15T18:15:47.067 に答える