3

div の子要素をドラッグできないようにしようとしています。これまでのところ、すべての disabled:true イベントを手動で入力する必要があり、これが面倒です。すべての要素を選択して、選択したメイン要素のみをドラッグできないようにする方法はありますか?

$(function() {
    $( "#profile-advanced-right div" ).draggable();
$( "#profile-advanced-left div" ).draggable();
$( ".main-head" ).draggable({disabled:true});
$( ".main-content" ).draggable({disabled:true});
$( ".h3" ).draggable({disabled:true});
$( ".subtitle" ).draggable({disabled:true});
$('.ui-state-disabled').css({'opacity':'1'});
});

それが私がこれまでに持っていたもので、htmlは次のようなものです

<div id="profile-advanced-right">
  <div class="module main">
    <div class="main-head">
  <span class="h3">Title</span>
 </div>
 <div class="main-content">
   <div>
   yadda
 </div>
</div>
</div>
4

2 に答える 2

4

jQueryセレクター構文を使用するドラッグ可能のキャンセルプロパティを使用して、子要素がドラッグ可能になるのを防ぐことができると思います。すべての子要素がドラッグ可能にならないようにするには、次を使用できます。

$('#profile-advanced-right').draggable({ cancel: '#profile-advanced-right' > * });
于 2014-10-20T11:22:26.353 に答える
1

コード例を次のように編集して、 children() メソッドを試してください。

$(function() {
    $("#profile-advanced-right div").draggable();
    $("#profile-advanced-left div").draggable();
    $("#profile-advanced-right div").children().draggable({disabled:true});
    $("#profile-advanced-left div").children().draggable({disabled:true});
    $('.ui-state-disabled').css({'opacity':'1'});
});

詳細http://api.jquery.com/children/

目的の UX がわからない場合は、ドラッグ可能にしたい要素だけにハンドルを使用することも検討してください: http://jqueryui.com/draggable/#handle

于 2012-11-30T01:39:13.317 に答える