Question

我从一个我发现在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()或其他什么东西？

有人可以赐教我吗？ =）感谢！

Answer 1

$("#SelectRight").is(":empty")

Answer 2

$('#SelectRight option').length:

或

$('#SelectRight').is(':empty');

Answer 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 example

Answer 4

使用此：

$('#SelectRight').find('option').size();

Answer 5

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

检测列表框是否为空（没有选项）

5 个答案: