0

我在 html 正文中有许多复选框，并且一些复选框具有特定的 css 类。

我只希望每当我选择一个按下 shift 键的复选框时，所有复选框都只在当前复选框之上，并且只在一个复选框之下，该复选框在之前的某个事件中已经选中（选中），相应的 css 类在 DOM 中选中（选中），应该自动检查（选择）。

其余所有复选框应保持不变。

这是我想做的事情：

html

<input type="checkbox" class="select-row"/>
<input type="checkbox" class="select-row"/>
<input type="checkbox" />
<input type="checkbox" class="select-row"/>
<input type="checkbox" class="select-row"/>
<input type="checkbox" />
<input type="checkbox" class="select-row"/>
<input type="checkbox" class="select-row"/>
<input type="checkbox" />
<input type="checkbox" class="select-row"/>

js：

$('.select-row').click(function(e){
if ( e && e.originalEvent.type === "click" && e.originalEvent.shiftKey === true) {
    //what to write?
  }
});

这是jsfiddle http://jsfiddle.net/839pS/8/

我怎么做？

4

1 回答 1

3

使用该.prevUntil()函数选择前面的复选框，然后对它们执行任何您需要的操作（例如将它们的checked属性设置为 true）：

var $previousCheckboxes = $(this).prevUntil(':checked', 'input[type="checkbox"]');
$previousCheckboxes.prop('checked', true);

更新了 jsFiddle

我不完全确定确切的停止条件，因此出于示例的目的，我只是选择了“它到达的第一个选中的复选框”。在对该问题的评论中讨论后，这个 jsFiddle是所需的确切功能。

于 2013-10-15T12:14:31.203 回答