2016-08-24 12 views
0

マウスを使用してこれを動作させることができます。私はそれをキーボードを使用して動作させることはできません。jQueryUIドロップ可能アラートがドロップされたとき - キーボードフォーカス

これは動作し、マウスを使用して削除するときのメッセージを追加します。

$('.drop_01').droppable ({ 
    drop: function() { 
     $('span.movedItem1').remove(); 
     $(this).prepend('<span class=\"movedItem1\">Item moved to Program philisophy drop area Vision/mission.</span>'); 
    } 
}); 

私は、キーボードの組み合わせAltキー+ 1を使用した場合と同じことが起こる持っている必要があります。私はこれを持っていて、いくつかのバリエーションを試しましたが、それを動作させることはできません。アイテムはまだドロップされた位置に移動しますが、メッセージは表示されません。

$(".activity").on("keydown", "#activity_contents a", function (e) { 
if(e.altKey && (e.which === 49)) { 

$('.drop_01').droppable ({ 
    drop: function() { 
     $('span.movedItem1').remove(); 
     $(this).prepend('<span class=\"movedItem1\">Item moved to Program philisophy drop area Vision/mission.</span>'); 
    } 
}); 

} 
}); 

これが達成可能であれば、助けてください。これを明確にするためには、メッセージを表示するだけでドラッグ&ドロップ機能は追加されていない多くのコードが投稿されています。

答えて

0

私はこれを間違った方法で見ていました。私が持っている解決策(ちょっとばかばかしいですが):

// CtRL key moves something to next column 
$(".activity").on("keydown", ".connected-sortable.draggable li", function (event) { 
    var $this = $(this) 
     , key = event.keyCode || e.which 
     , $holder = $this.parents(".activity") 
     , $selectedul = $this.parent() 
     , $availableuls = $holder.find(".connected-sortable") 
     , currentlistindex = $selectedul.data("list-index") 
     , nextlistindex = currentlistindex + 1 
     , $nextul = $holder.find(".connected-sortable[data-list-index='" + nextlistindex + "']") 
     , $originalul = $holder.find(".connected-sortable[data-list-index='0']"); 

    if ($nextul.length == 0) { 
     $nextul = $originalul; 

    } 

    if(nextlistindex === 1) { 
     $('span.movedItema').remove(); 
     $('span.movedItemb').remove(); 
     $('span.movedItemc').remove(); 
     $('span.movedItemd').remove(); 
     $(this).focus().prepend('<span class=\"movedItema offscreenText\">Item moved to Program philisophy drop area Vision/mission.</span>'); 
    } 
    if(nextlistindex === 2) { 
     $('span.movedItema').remove(); 
     $('span.movedItemb').remove(); 
     $('span.movedItemc').remove(); 
     $('span.movedItemd').remove(); 
     $(this).focus().prepend('<span class=\"movedItemb offscreenText\">Item moved to Program philisophy drop area Beliefs/values.</span>'); 
    } 
    if(nextlistindex === 3) { 
     $('span.movedItema').remove(); 
     $('span.movedItemb').remove(); 
     $('span.movedItemc').remove(); 
     $('span.movedItemd').remove(); 
     $(this).focus().prepend('<span class=\"movedItemc offscreenText\">Item moved to Program philisophy drop area Strategies.</span>'); 
    } 
    if(nextlistindex === 4) { 
     $('span.movedItema').remove(); 
     $('span.movedItemb').remove(); 
     $('span.movedItemc').remove(); 
     $('span.movedItemd').remove(); 
     $(this).focus().prepend('<span class=\"movedItemd offscreenText\">Item moved back to Program philisophy Factors list.</span>'); 
    } 
関連する問題