Question

我有15个列表项。我允许用户只选择其中的5个。然后我将此信息放入数组并提交给服务器。

<li><a href="#" id="item1" class="select">Item One</a></li> ... etc.

然后我使用此代码切换所选项目的类别

function SelectPrizes (){
$('a.select').click(function() {
    $(this).toggleClass("selected");
    $(this).text($(this).text() == 'Choose prize' ? 'Selected' : 'Choose prize');
    return false;
});
}

我的问题是，如何只允许5个选项，并且只按标识将所选项添加到数组中。

我知道我可以通过hasClass（'selected'）进行过滤，但我无法找到正确的语法。

Answer 1

您可以使用slice(start, end)从指定的索引开始，从选择中获取特定数量的结果。

var results = $("a.select").slice(0, 5);

您的问题的第二部分可以通过条件检查来回答：

if ($(this).hasClass("selected")) {

}

Answer 2

检查以下值，以确定是否选择了5个元素 -

$('a.select[class*="selected"]').length==5

Answer 3

回答你的三个问题：

允许5种选择：确保$('a.select.selected')的长度不超过5的限制：

if ( $('a.select.selected').length < 5 ) {
    // Does not exceed, so we can add...
}

仅将所选项目添加到数组：只添加“已选择”类的项目：

$('a.select.selected').each(function(){
    // Add to array
});

作为Disappointment先生建议的hasClass（'selected'）的语法：

if ( $(this).hasClass('selected') ) {

}

如果您允许用户选择5个以上的项目，然后只选择其中的5个项目，Disappointment先生的解决方案将会有效。

另外，建议改进你的HTML。我假设li项目有一个ul父项。将类'select'设置为此ul父级并使用选择器：$（'ul.select li a'）。click（）。

我已经把这些全部放在一个jsfiddle中：http://jsfiddle.net/5b8aj/6/

限制选择的数量并将所选数据插入到数组中

3 个答案: