我正在寻找关于事件和ui对象的jQuery可选事件的信息:“选择”和“开始”作为参数。我在文档中找不到这个并且通过属性循环没有帮助。
$('#content_td_account').selectable({
filter: 'li:not(".non_draggable")',
selecting: function(event, ui) {
}
});
具体来说,我想找到被选中的元素并检查它们以查看它们的父元素是否相同。我假设这将在ui对象的某些地方。
答案 0 :(得分:12)
选择元素后,会添加ui-selected
类。
因此,您可以使用$(".ui-selected")
这可能无法正常工作,但我认为这个想法会是这样的:
$('#content_td_account').selectable({
filter: 'li:not(".non_draggable")',
selecting: function(event, ui) {
var p = $(this).parent();
$(".ui-selected").each(obj, function() {
if(obj.parent() == p) {
// get rad
}
});
}
});
答案 1 :(得分:10)
您必须使用为组选择中的每个选定项目触发的选定和未选定事件。
var selected = new Array();
$("#selectable").selectable({
selected: function(event, ui){
selected.push(ui.selected.id);
},
unselected: function(event, ui){
//ui.unselected.id
}
});
答案 2 :(得分:1)
使用:last
或:first
选项不是第一个选择,而是第一个选择li
这是我管理的解决方案:
HTML
<ol class="selectable">
<li class="ui-widget-content"
id="selectable_1"
value="1"
> First Selectable </li>
<li class="ui-widget-content"
id="selectable_2"
value="2"
> Second Selectable </li>
</ol>
在此代码中,我为li
提供了一个id和一个值,从而使它们可用于选择事件的ui
属性
JAVASCRIPT
//A place to put the last one
var last_selected_value;
var last_selected_id;
$( ".selectable" ).selectable({
selecting: function(event, ui) {
//In the selection event we can know wich is the last one, by getting the id on
//the ui.selecting.property
last_selected_value = ui.selecting.value;
last_selected_id = ui.selecting.id;
},
stop: function(event, ui) {
//Here the event ends, so that we can remove the selected
// class to all but the one we want
$(event.target).children('.ui-selected').not("#" + last_selected_id)
.removeClass('ui-selected');
//We can also put it on a input hidden
$( "#roles_hidden" ).val(last_selected_value);
}
});
答案 3 :(得分:0)
这将解决您的问题:
<script type="text/javascript">
$(function() {
$("#selectable").selectable({
stop: function(){
var result = $("#select-result").empty();
$(".ui-selected", this).each(function(){
var index = $("#selectable li").index(this);
result.append(" #" + (index + 1));
});
}
});
});
</script>
<div class="demo">
<p id="feedback">
You've selected: <span id="select-result">none</span>.
</p>
<ol id="selectable">
<li class="ui-widget-content">Item 1</li>
<li class="ui-widget-content">Item 2</li>
<li class="ui-widget-content">Item 3</li>
<li class="ui-widget-content">Item 4</li>
<li class="ui-widget-content">Item 5</li>
<li class="ui-widget-content">Item 6</li>
</ol>
答案 4 :(得分:-1)
该事件中的ui参数是对元素的引用, 如果是选定的事件,ui.selected事件将是元素,如果它取消选择unselected.ui ..... etc