如何从一个HTML选择标签

问题描述：

<select> 
    <option value="0">Option 0</option>. 
    <option value="1">Option 1</option> 
    <option value="2">Option 2</option> 
</select>

当你点击选择我想的第一个项目将不再列出。它也必须适用于所有浏览器。如何才能做到这一点？

谢谢。

听起来你正在使用的第一选项为一个''的替代品。不要那样做，而是写适当的标记。 – Quentin 2010-05-25 05:54:31

标记的外观如何？ – Emanuel 2010-05-25 06:06:38

@David - 把它写成答案，因为它是正确的。 – annakata 2010-05-25 06:55:00

答

<select id="selectBox" 
    onFocus="javascript:nullOpt=document.getElementById('nullOpt'); 
      (undefined != nullOpt) ? 
      document.getElementById('selectBox').removeChild(nullOpt) : 
      true;" 
    onBlur="javascript:insertBefore(
          nullOpt, 
          document.getElementById('selectBox').firstChild 
        );"> 
    <option id="nullOpt">Please select...</option> 
    <option>val1</option> 
    <option>val2</option> 
    <option>val3</option> 
</select>

编辑：增加了新要求的功能，排序。

除非您选择任何项目并且“选择”标签失去焦点如何重新显示第一个元素？ – Emanuel 2010-05-25 17:32:11

你没有提到你想重新显示它，我假设如果他们专注于选择框，那么他们会知道在那个时候选择一些东西。您可以将nullOpt指定给另一个变量，并在需要时将其重新添加到Blur上。 – mVChr 2010-05-25 18:33:43

固定显示如何做到这一点，但我认为这将清除他们的选择。您可能想重新考虑您的功能规格。 – mVChr 2010-05-25 20:34:36

答

嗯不知道编辑这样的集合是否会100％的时间工作。如果您不提供选择项目的值，那么您应该能够抛出验证错误，因为没有选择“值”。

<select> 
    <option value="">Select a value...</option> 
    <option value="1">Option 1</option> 
    <option value="2">Option 2</option> 
</select>

然后使用其中一个JQuery validation libraries来验证它。

我不需要验证。我想仅为信息显示第一个选项。 – Emanuel 2010-05-25 07:07:41

这是'

答

只需在第一个选项中添加display：none即可。第一个选项只会显示为选择框的“标题”，而不会显示在选项中。它适用于Chrome浏览器的Firefox &。

<select> 
 
    <option style="display:none;" value="0">Option 0</option>. 
 
    <option value="1">Option 1</option> 
 
    <option value="2">Option 2</option> 
 
</select>

如何从一个HTML选择标签

相关推荐