2

我从一个在 Internet 上发现有用的示例中获得了此代码。它使用两个列表框，一个在左侧，另一个在右侧，并将左侧的一个元素传递到右侧，反之亦然。这是带有选项的选择的 HTML：

<select id="SelectLeft" multiple="multiple">
 <option value="1">Stack Overflow</option>
 <option value="2">Server Fault</option>
 <option value="3">Ask Ubuntu</option>
 <option value="4">Super User</option>
</select>
<button id="MoveRight"> >> </button>
<button id="MoveLeft"> << </button>
<select id="SelectRight" multiple="multiple"></select>

这是在列表框之间移动元素的 JavaScript：

$(function() {
 $("#MoveRight,#MoveLeft").click(function(event) {
  var id = $(event.target).attr("id");
  var selectFrom = id == "MoveRight" ? "#SelectLeft" : "#SelectRight";
  var moveTo = id == "MoveRight" ? "#SelectRight" : "#SelectLeft";
  var selectedItems = $(selectFrom + " :selected").toArray();
  $(moveTo).append(selectedItems);
   selectedItems.remove;
  });
});

如您所见，代码只是根据按下的按钮确定必须添加和删除哪些选定元素。我需要检测右侧的列表框（“SelectRight”）何时没有选项。例如，在一开始没有按下任何内容或用户删除所有项目时。

我需要一种方法来检测这一点，以便我可以触发我拥有的验证过程。

编辑

感谢您的回答，我发现这$("#SelectRight").is(":empty")似乎是我需要的。但是这种行为不是我需要的。每次清空列表框时，我都需要启动一个事件。例如，如果我这样做：

if($("#SelectRight").is(":empty")) alert("It works?? =O");

此警报仅在页面加载时显示，但如果我添加然后删除元素，则不再触发。所以我想我需要添加一个事件处理程序或其他东西。也许是一个 JQuery 之类的.on()？

4

5 回答 5

8 
$("#SelectRight").is(":empty")
于 2012-05-18T16:47:26.073 回答
4 
$('#SelectRight option').length:

或者

$('#SelectRight').is(':empty');
于 2012-05-18T16:47:34.570 回答
3

怎么样：

$("#MoveRight,#MoveLeft").click(function(event) {
    var id = $(event.target).attr("id");
    var selectFrom = id == "MoveRight" ? "#SelectLeft" : "#SelectRight";
    var moveTo = id == "MoveRight" ? "#SelectRight" : "#SelectLeft";
    var selectedItems = $(selectFrom + " :selected").toArray();
    $(moveTo).append(selectedItems);
    selectedItems.remove;
    if($('#SelectRight option').length<=0) console.log('Right empty');
});​

jsFiddle 示例。

于 2012-05-18T16:50:22.000 回答
1

用这个：

​$('#SelectRight').find('option').size();
于 2012-05-18T16:51:29.420 回答
0

为什么不添加一个 if 语句来检查列表框是否为空。我会把它放在 selectedIteams.remove 之后，每次调用函数时都会检查它以更改列表框，这将清空它。或者您可以向您的元素添加一个 onchange = 'someFunction()' 函数，并在每次元素更改时进行检查。

于 2012-05-18T19:18:19.700 回答