Javascript 当用户选择一次值时，如何禁用该值？

我想在用户选择值选项后禁用它

例如，如果用户选择（上午7:00），那么下次他们去时 然后再次单击下拉列表，该值将不可供他们选择。 最好的方法是什么

<td> Time it will display (Please enter time format hh:mm tt):         
    <td>
        <select ID="time_used" NAME="time_used"  VALIDATE="date" >
            <option selected> Select Time</option>
            <option value="7:00 AM">7:00 AM</option>   
            <option value="7:15 AM">7:15 AM</option> 
            <option value="7:30 AM">7:30 AM</option>   
            <option value="7:45 AM">7:45 AM</option>
            <option value="8:00 AM">8:00 AM</option>
            <option value="8:15 AM">8:15 AM</option> 
            <option value="8:30 AM">8:30 AM</option>   
            <option value="8:45 AM">8:45 AM</option>
            <option value="9:00 AM">9:00 AM</option> 
            <option value="9:15 AM">9:15 AM</option> 
            <option value="9:30 AM">9:30 AM</option>   
            <option value="9:45 AM">9:45 AM</option>                    
            <option value="10:00 AM">10:00 AM</option>
        </select>
    </td>
</td>

将显示的时间（请输入时间格式hh:mm tt）： 选择时间 上午7:00 上午7:15 上午7:30 上午7:45 上午8:00 上午8:15 上午8:30 上午8:45 上午9点 上午9:15 上午9:30 上午9:45 上午10:00 非常简单：

// get a reference to the menu
var timeSelect = document.getElementById('time_used')

// set an onchange handler
timeSelect.onchange = function(){
    timeSelect.setAttribute('disabled', 'disabled') // set the disabled attribute
}

---

@ncksllvn的答案是可行的，但我会提出一个不同的解决方案

根据我们的工作经验，禁用的控件有两个主要缺点

它们不作为提交的一部分发送

用户会被带有边框的东西弄糊涂，但无法选择

第二个问题也适用于尝试创建只读控件的情况

<td> Time it will display (Please enter time format hh:mm tt):         
    <td>
        <select ID="time_used" NAME="time_used"  VALIDATE="date" >
            <option selected> Select Time</option>
            <option value="7:00 AM">7:00 AM</option>   
            <option value="7:15 AM">7:15 AM</option> 
        </select>
        <span id="time_used_display" style="display:none"></span>
    </td>
</td>



function disabledTimeSelect() {
    var timeSelect = document.getElementById('time_used')
    var value = timeSelect.options[timeSelect.selectedIndex].value;

    if (value === "") {
      return;
    }

    timeSelect.style.display = "none";
    var span = document.getElementById("time_used_display");

    span.innerHTML = value;
    span.style.display = "inline";
}


window.onload = function() {
  disabledTimeSelect();
};

将显示的时间（请输入时间格式hh:mm tt）： 选择时间 上午7:00 上午7:15 函数disabledTimeSelect（）{ var timeSelect=document.getElementById（'time_used'） var value=timeSelect.options[timeSelect.selectedIndex].value； 如果（值==“”）{ 返回； } timeSelect.style.display=“无”； var span=document.getElementById（“使用的时间\u显示”）； span.innerHTML=值； span.style.display=“inline”； } window.onload=函数（）{ 禁用TimeSelect（）； }; 编辑

从：

---

此布尔属性表示表单控件不可用于交互。特别是，单击事件不会在禁用的控件上调度此外，禁用控件的值不会随表单一起提交。

您是否使用任何Javascript库或直接JS来完成此任务？不确定从何处开始，我更希望直接jsGood知道禁用的输入不会在提交时发送！谢谢，但不完全是我想要的，我试过了，但我希望下次用户提交表单时，他们提交表单的时间将不可用，请查看更新的答案。顺便说一句，这是你真正需要在你的问题中包含的细节。