原始问题
有没有一种写条件的方法if ( "no draggables have been dropped in these droppables" )
?我知道jQuery有可能实现;而且我猜可能看起来像这样:
if ( $('.droppable').something( $('.draggable') ); )
但我真的不知道要使用什么确切的代码。jQuery库中是否存在现有方法,还是我需要创建一个新函数来手动检查是否已删除任何可拖动对象?
编辑
对这样一个简短的问题表示歉意;我只是需要一些快速的编码知识,因为我需要快速完成该项目,所以我发布了一个可以迅速回答的问题。
这个问题已经得到了回答,但是由于它是“不清楚的”而被搁置了,因此我决定添加一些项目细节,以查看其他人是否对如何处理可丢弃对象有其他建议。
项目规格
我试图让我的可放置对象.css('border', '1px solid red')
在用户按下submit
按钮时不显示任何可拖动对象时显示“错误”反馈。我将信息checkwrong = 'false'
作为默认值存储在变量中,因此,如果没有将任何可拖动对象放置在WRONG的checkwrong
可放置对象中,则将其设置为'false'
,并将返回“正确”反馈。
但是问题是,用户每次按下提交按钮时都不会拖放任何可拖动对象,因此可拖放对象将始终显示“ CORRECT”的反馈,.css('border', '1px solid lime')
因为checkwrong
如果没有可拖动对象没有拖放,则没有代码会更改其值。
解决方案:
我创建了一个代码块,该代码块在单击“提交”按钮时运行:
if (!$('.checkBox').hasClass('dropped')) {
checkwrong1 = "true";
checkwrong2 = "true";
checkwrong3 = "true";
checkwrong4 = "true";
checkwrong5 = "true";
}
.checkBox
是所有droppable的通用类,我将代码设置为$('.checkBox').addClass('dropped');
在drop:
每个droppable事件上运行。
这是每当将可拖动对象放入可放置对象时运行的代码块的一部分。
#dropAreaCheck1
是可放置
#cMark1, #cMark2, etc.
对象的唯一ID,是可拖动对象的唯一ID。
$( "#dropAreaCheck1" ).droppable({
activeClass: "ui-state-hover",
hoverClass: "ui-state-active",
cursor: "arrow",
drop: function( event, ui) {
console.log(ui.draggable.attr('id')) ;
checkwrong1="true";
checkanswers ++;
if (checkanswers == 3) { $('.checkBox').droppable({ disabled: true }); };
$('.checkBox').addClass('dropped');
$('#dropAreaCheck1').droppable( 'disable' );
if(ui.draggable.attr('id') == "cMark1"){ $( "#cMark1" ).draggable({ disabled: true }); }
if(ui.draggable.attr('id') == "cMark2"){ $( "#cMark2" ).draggable({ disabled: true }); }
if(ui.draggable.attr('id') == "cMark3"){ $( "#cMark3" ).draggable({ disabled: true }); }
if(ui.draggable.attr('id') == "cMark4"){ $( "#cMark4" ).draggable({ disabled: true }); }
if(ui.draggable.attr('id') == "cMark5"){ $( "#cMark5" ).draggable({ disabled: true }); }
if(ui.draggable.attr('id') == "cMark6"){ $( "#cMark6" ).draggable({ disabled: true }); }
if(ui.draggable.attr('id') == "cMark7"){ $( "#cMark7" ).draggable({ disabled: true }); }
if(ui.draggable.attr('id') == "cMark8"){ $( "#cMark8" ).draggable({ disabled: true }); }
$( ".drag" ).css( 'cursor', 'default' );
$( ".draggable" ).draggable({ disabled: false });
$( "#dropAreaCheck1" ).append(ui.draggable.css('position','static'))
$( ".drag" ).append(ui.draggable.css('margin','5px 0'))
$(this).droppable( 'disable' );
}
});
当您放下某些东西时,您将执行一些代码。使用此代码及其结果状态来确定是否已丢弃某些内容。
例如,以开始<div class="droppable undropped">
,然后放下do $('.droppable').removeClass('undropped')
。然后,您可以$('.droppable.undropped')
为“原始”选择“ by ”。
或者,如果代码将某些内容放入可放置对象中,则可以选择其内容(或不存在)。
在不知道您如何精确地处理droppable的情况下,我无法比此更具体地回答这个问题。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句