3

私は、この質問のいくつかの変種だけを他のいくつかの場所、特にこことここで尋ねたのを見てきました。

基本的に、ボード上の各正方形がドロップ可能で、各ゲームピースがドラッグ可能であるチェッカーゲームボードがあります。各正方形には一度に 1 つのピースしか配置できません。正方形にピースがあるかどうかに応じて、有効化/無効化の方法を切り替えようとしています。

私がこれまでに得たものへのリンクは次のとおりです: http://jsbin.com/ayalaz、および以下は最も適切なコードです。

function handleDrop(e, ui) {
            var tileNumber = $(this).data('tile');
            // Make the gamepiece snap into the tile
            ui.draggable
                .data({ // WHAT IF PIECE IS SET BACK DOWN IN SAME TILE... CHECK FOR IT!
                    'preRow': ui.draggable.data('curRow'),
                    'preCol': ui.draggable.data('curCol'),
                    'curRow': $(this).data('row'),
                    'curCol': $(this).data('col')
                });
            $(this).append($(ui.draggable));
            ui.draggable
                .position({
                    of: $(this),
                    my: 'left top',
                    at: 'left top'
                });
            $(this).droppable('disable');
            //console.log("Gamepiece set down at: (" + $(this).data('row') + "," + $(this).data('col')+ ")");
        }

function handleOut(e, ui) {
            // HOW TO TOGGLE DROPPABLE??
            $(this).droppable('enable');
        }

何かアドバイス？

前もって感謝します！ジェレミー

4

1 に答える 1

2

最初のドロップ イベントの後、タイルでドロップ可能を正常に無効にしているようです。あなたの問題は、占有されているタイルの最初のセットで最初にドロップ可能を無効に設定していないことです。

ゲーム ボードとピースを作成したら、CSS セレクターがあなたの構造を正確に反映していると仮定すると、次のようになります。

$('div.gamePiece').parent().droppable("option", "disabled", true);

これは、初期オプションでドロップ可能性を変更する構文とは異なることに注意してください。jQuery UIのドロップ可能なドキュメントから：

//initialize
$( ".selector" ).droppable({ disabled: true });

//setter
$( ".selector" ).droppable( "option", "disabled", true );

編集

私は間違っていたよう$(this).droppable('disable');で、$(this).droppable('enable');jquery-uiには有効化と無効化のためのエイリアス関数があります。 

enable: function() {
    return this._setOption( "disabled", false );
},
disable: function() {
    return this._setOption( "disabled", true );
},
于 2012-04-27T20:11:54.800 に答える