2017-05-09 143 views
0

我有一個可拖動元素和一個可拖動元素。JQuery UI droppable元素禁用選項不更新

通過一組單選按鈕,我將droppable> option> disabled的狀態更改爲True或False。

要檢查我閱讀障礙期權的價值(可放開)和一個div#D1

內顯示在默認情況下,因此正在禁用選項設置爲false狀態,我能將元素放置在可droppable元素中,如果我將選項設置爲True,然後再將其更改爲False,則不起作用。狀態顯示disabled選項設置爲false,但仍然不接受。

$(document).ready(function() { 
/////////// 
$(function() { 
$("#draggable").draggable({ 
}); 
}); 
/////////// 
$("#droppable").droppable({ 
drop: function(event, ui) { 
    $(this) 
    .find("p") 
    .html("Welcome Dropped!"); 
} 
}); 
/////////////// 
var status_used = $("#droppable").droppable("option", "disabled"); 
$('#d1').html(" <b>Status of option : disabled </b> " + status_used); 
//////////// 
$("input:radio[name=r1]").click(function() { 
var sel=$(this).val() 
$("#droppable").droppable("option", "disabled", sel); 
var status_used = $("#droppable").droppable("option", "disabled"); 
$('#d1').html(" <b>Status of option : disabled </b>: " + "("+ sel + ")" + 
status_used); 
}) 
/////////////////////// 
}) 

的HTML部分是這裏

<div class='row'> <div class='col-md-6'> 
    <div id="draggable" class="ui-widget-content"> 
    <p>Drag me to my distination</p> 
    </div> 
</div><div class='col-md-2'> 
    <div id="droppable" class="ui-widget-header" > 
    <p>Dropp here</p> 
    </div> 
</div></div> 


<div id=d1></div> 
<br> 
<div class='radio-inline'> 
    <label><input type='radio' name='r1' id='r1' value='true' > True</label> 
</div> 

<div class='radio-inline'> 
    <label><input type='radio' name='r1' id='r2' value='false'  checked>False</label> 
</div> 

回答