HTML在禁用选项旁边添加帮助符号(按钮)

时间:2017-05-04 12:52:09

标签: php html css

如果可能的话,我想知道如何在html下拉列表中的禁用选项旁边添加帮助符号。我想这样,当你点击它时,它会告诉你为什么该选项被禁用。与下面的下拉列表类似的东西。

enter image description here

这是我现在下拉列表的基本代码。

<select name="description" rows="4" class="form-control">
                <option value="RhinoTab"><?php echo _l('estimate_table_option1_1'); ?></option>
                <option value="RTi"><?php echo _l('estimate_table_option1_2'); ?></option>
                <option value="Magical Shit" disabled>Magical Shit</option>
              </select>

1 个答案:

答案 0 :(得分:0)

我最终找到了一个例子,我可以用它来解决我的项目工作问题。当你点击&#34;禁用&#34;而不是有一个图标。选项,但它会做一些足够接近我正在寻找的东西。

 $(function(){
    var options_sel_idx = 0;

    $("#options").on("change", this, function(event) {
        if($(this.options[this.selectedIndex]).hasClass("disabled")) {
            alert("a");
            this.selectedIndex = options_sel_idx;
        } else {
            options_sel_idx = this.selectedIndex;
        }
    });
});

<style type="text/css">
    .disabled {color:#808080;}
</style>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="options" id="options">
  <option value="">Select</option>
  <option value="1">Options 1</option>
  <option value="0" class="disabled">Options 2</option>
  <option value="0" class="disabled">Options 3</option>
  <option value="0" class="disabled">Options 4</option>
</select>