Question

我正在处理一个打印表单，它将使管理员用户更改打印表单的布局所以我选择JQuery Dragable作为工作，它的工作正常，但他们是一个问题启用或禁用HTML中可拖动的第一个元素，当可拖动禁用时，使用禁用样式，其他元素保持原始外观我正在使用IE 8。我在Fierfox和Chrome上运行代码，结果是所有Element都改变了他们的样式以禁用样式。我需要Elemnet保持原始的Stayl

function EnableDragAndDrop(cBox) {
    $("#divDoB").draggable({ disabled: cBox.checked });
    $("#divNationalNo").draggable({ disabled: cBox.checked });
    $("#divSex").draggable({ disabled: cBox.checked });
    $("#divPlaceOfBirth").draggable({ disabled: cBox.checked });
    $("#divIssueDate").draggable({ disabled: cBox.checked });
    $("#divMotherName").draggable({ disabled: cBox.checked });
    $("#divExpDate").draggable({ disabled: cBox.checked });
    $("#divAuthority").draggable({ disabled: cBox.checked });
   $("#divPassportHolderName").draggable({ disabled: cBox.checked });

}

Answer 1

如果你只是给同一个<div>元素，而不是使用ID，就像class="draggable"一样，你可以让这个更多更短，如下所示：

function EnableDragAndDrop(cBox) {
  $(".draggable").draggable(cBox.checked ? "disable" : "enable");
}
$(function() {
  $(".draggable").draggable({ containment: '#divDragArea', scroll: false });
});

而不是{disable: boolean}您需要调用"enable"或"disable"方法，这取决于是否选中此框。作为旁注，您可以在单个$(function() { });包装器中放置任意多个，每个语句不需要一个：）

Answer 2

谢谢大家我找到了解决方案你打电话的时候 $（“＃divDoB”）。draggable（{disabled：true}）; JQuery插入一个Css类，将不透明度设置为.35 并使Item看起来处于禁用模式所以要保持相同的外观并在两种模式下启用和禁用我只是将元素不透明度设置为1
谢谢每一个人：）

启用禁用JQuery可拖动

2 个答案: