<select multiple>仅用于4个对象[重复]

Question

这个问题已经在这里有了答案：

• 您如何限制在html选择框中选择的选项？ 8个答案

这可能吗？ 只允许您选择4个对象，而无需使用javascript或php（或您使用的哪种服务端语言）？

如果我有这样的事情：

<select multiple>
    <option>cat</option>
    <option>hat</option>
    <option>sat</option>
    <option>fat</option>
    <option>brat</option>
</select>

我可以限制它，说只能选择其中的4个吗？ 这是size=4派上用场的地方吗？

这不是重复的

Answer 1

不，没有使用JavaScript的方法就无法实施这种限制。 这样的事情可能会起作用：

func = function(e) {
    e|e=window.event;
    var t = e.srcElement || e.target;
    if( !t.tagName) t = t.parentNode;
    if( t.tagName.toLowerCase() == "select" && t.hasAttribute("multiple") && t.hasAttribute("data-max")) {
        var o = t.options, l = o.length, i, m = +t.getAttribute("data-max");
        for( i=0; i<l; i++) {
            if( o[i].selected) {
                if(m>0) m--;
                else o[i].selected = false;
            }
        }
    }
};
if( document.body.addEventListener) document.body.addEventListener("change",func,false);
else document.body.attachEvent("onchange",func);

然后，您可以使用以下HTML：

<select multiple data-max="4">

---

此外，您应该实现服务器端验证。 假设此HTML：

<select multiple name="test[]">

您可以使用以下PHP：

$_POST['test'] = array_slice($_POST['test'],0,4); // adjust the 4 to whatever limit