我这样下拉
<select multiple="multiple">
<optgroup label='name1'>
<option value="1">First</option>
<option value="2">Second</option>
<option value="3">Third</option>
</optgroup>
<optgroup label='name2'>
<option value="1">First</option>
<option value="2">Second</option>
<option value="3">Third</option>
</optgroup>
Iam使用jQuery UI MultiSelect Widget插件进行多下拉,但我应该从每个optgroup选项中只选择一个选项。
EG。如果为'name1'选择选项“First”,那么“second”,“third1”optgroup选项不应选择“third”。
答案 0 :(得分:0)
试试这个
var memoryOne;
var memoryTwo;
$("option").mouseover(function () {
var selectedOne = $("optgroup:nth-of-type(1)").children("option:selected").index();
var selectedTwo = $("optgroup:nth-of-type(2)").children("option:selected").index();
memoryOne = selectedOne;
memoryTwo = selectedTwo;
}).click(function () {
var theSelectedIndex = $(this).index();
var theParentIndex = $(this).parent().index();
setTimeout(function () {
clickEvent(theSelectedIndex, theParentIndex, memoryOne, memoryTwo);
}, 1);
});
function clickEvent(passedIndex, parentIndex, memoryOne, memoryTwo) {
var selectionOne = memoryOne;
var selectionTwo = memoryTwo;
var theParent = $("optgroup:eq(" + parentIndex + ")");
var theOption = $("optgroup:eq(" + parentIndex + ") option:eq(" + passedIndex + ")");
var theGrandParent = $("select");
theParent.find("option:not(option:eq(" + passedIndex + "))").prop("selected", false);
if (parentIndex == 0) {
$("optgroup:not(optgroup:eq(" + parentIndex + "))").children("option:eq(" + selectionTwo + ")").prop("selected", true);
} else if (parentIndex == 1) {
$("optgroup:not(optgroup:eq(" + parentIndex + "))").children("option:eq(" + selectionOne + ")").prop("selected", true);
}
}