Question

我正在使用选择框，不喜欢用户必须按住控制键以选择多个选项。这对基本管理员用户来说并不直观。

我在这里以及其他网站上看到了很多解决方案，而且我所看到的任何解决方案都无法在所有浏览器上运行。

是否有一个我没见过的简单解决方案。

以下是我正在使用但在FF中存在问题。

<select name="courses[_ids][]" multiple="multiple" id="courses-ids" class="form-control">
    <option value="1">Handling Training</option>
    <option value="2">Safety</option>
    <option value="3">Induction Training</option>
</select>

JS：

$("select").mousedown(function(e){
    e.preventDefault();

    var scroll = this.scrollTop;

    e.target.selected = !e.target.selected;

    this.scrollTop = scroll;

    $(this).focus();
}).mousemove(function(e){e.preventDefault()});

Answer 1

使用复选框代替。使用标签允许单击文本，并将它们放在带有滚动溢出的元素中，如果您需要＆＃34;滚动条。

<div id="courses-ids">
    <label><input type="checkbox" name="courses[_ids][]" value="1">Handling Training</label>
    <label><input type="checkbox" name="courses[_ids][]" value="2">Safety</label>
    <label><input type="checkbox" name="courses[_ids][]" value="3">Induction Training</label>
</div>

没有后端更改应该是nessecary。

跨浏览器选择框多个选项而不保持控制

1 个答案: