如何在jQuery或JS中的HTML选择中多次选择同一选项？

Question

资深开发人员

我已经创建了一段时间的应用程序，它相对有用。 但是，只有一个限制，我没有找到解决方法，是的，我已经阅读了多个类似的问题：

jQuery选择选项单击处理程序

单击选项通过jQuery选择？

使用jQuery模拟鼠标单击选择选项

jQuery在选择选项上模拟单击事件

jQuery click事件不适用于选项元素

包括其他非StackOverFlow论坛在内，我已经阅读了数千次使用jQuery更改事件的信息，并且自从我使用它以来我就知道了。 这是我的代码：

HTML：

<select id="selectTimes">
    <option disabled="disabled">Select Speech</option>
    <option value="0">Question of the Day (30s)</option>
    <option value="1">4 to 6 min (Ice-breaker)</option>
    <option value="2">5 to 7 min (Project 2-9)</option>
    <option value="3">8 to 10 min (Project 10)</option>
    <option value="4">1 to 1:30 min (Evaluator's intro)</option>
    <option value="5">2 to 3 min (Evaluation)</option>
    <option value="6">5 to 6 min (General Evaluator)</option>
    <option value="7">1 to 2 min (Table Topics)</option>
    <option value="8">10 to 12 min</option>
    <option value="9">13 to 15 min</option>
    <option value="10">18 to 20 min</option>
    <option value="11">Custom</option>
</select>

jQuery的：

$("#selectTimes").on("change", function () {
    setLocalStorage("selected", $(this).val());
    if ($(this).val() === "11")
        $("#divCustomTime").modal();
    else {
        isCustom = false;
        setLocalStorage("isCustom", isCustom);
    }
});

但是，我的主要挑战是，每个人都可以选择一个以上的选项，这有点棘手，因为在这一点上，他们需要先选择另一个选项，然后再选择一个，最后一个选项，我敢肯定，这样做与任何人。 您可以在以下图像中查看步骤：

没有选项的第一个视图：

选择自定义时间：

手机：

平板电脑（<10英寸）：

带有Select2的表（10英寸以上）：

变更时间：

选择的选项：

关于某人如何在不单击其他位置的情况下多次选择同一选项的任何建议或解决方法？ 感谢您的想法。

PS：

我知道click事件仅在Firefox中有效，并且由于这是适用于Android的移动应用程序，因此不会起作用。
我测试了像select2这样的自定义选择，但没有成功。

Answer 1

这可能会帮助您。 这些选项可以根据您的UI作为输入选项给出。 因此，您可以使用输入标签本身，它也可以在单击所选选项时触发事件

<html>
    <head>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js">
        </script>
        <style>
            .box
            {
                border:1px solid whitesmoke;
                padding:10px 0px;
                display:block;

            }
            </style>
    </head>
    <body>
        <div class="box">
            <input  type="radio" name="selectest" value="name1" checked> Name1 </input>
        </div>
        <div class="box">
            <input  type="radio" name="selectest" value="name2"> Name2 </input>
        </div>
        <div class="box">
            <input  type="radio" name="selectest" value="name3"> Name3 </input>
        </div>
        <div class="box">
            <input  type="radio" name="selectest" value="name4"> Name4 </input>
        </div>
    </body>
    <script>
        $("input").click(function(){
            alert($(this).val());
        });
    </script>
</html>

如何在jQuery或JS中的HTML选择中多次选择同一选项？

问题描述

1 个解决方案

解决方案1
1 已采纳 2019-01-13 09:58:06

如何在jQuery或JS中的HTML选择中多次选择同一选项？

问题描述

1 个解决方案

解决方案1 1 已采纳 2019-01-13 09:58:06

解决方案1
1 已采纳 2019-01-13 09:58:06