Javascript 当表单中有两个选择框时，为什么ID不取？

我在下面的列表中有两个选择框，它们都有不同的id“语言”和“时间”。现在的问题是我的脚本没有正确显示错误。我用边框颜色表示错误。 有人能帮我吗

<div class="field_wrap">
  <select name="language" id="language" onblur="validateSelect(language)" class="select_promo">
    <option value="0" disabled selected>Prefered Language</option>
    <option value="1">English</option>
    <option value="2">Hindi</option>
    <option value="3">Tamil</option>
    <option value="4">Malayalam</option>
  </select></div>
<div class="field_wrap">
  <select name="time" id="time" onblur="validateSelect(time)" class="select_promo">
    <option value="0" disabled selected>Time to Contact</option>
    <option value="1">8 - 10 AM</option>
    <option value="2">10 - 12 AM</option>
    <option value="3">12 - 2 PM</option>
    <option value="4">2 - 5 PM</option>
    <option value="5">5 - 8 PM</option>
  </select></div>
</div>

---

您的代码中有一些错误：

您声明函数

validateSelect

两次

当函数中需要元素id时，将元素传递给该函数

onblur

选择中的事件处理程序应接受引号中的参数

以下是javascript的外观：

function validateSelect(id){ 
  var el = document.getElementById(id),
      myValue = el.value;
  if(myValue > 0){
    el.style.borderColor ='#80c75a';
    document.getElementById(id+'Error').style.display = "none";
     return true;
  }else{
    el.style.borderColor ='#e35152';
    return false;
  }
}

// Validate Select
validateSelect('time');
validateSelect('language');

您的OnBlur应该如下所示：

function validateSelect(id){ 
  var el = document.getElementById(id),
      myValue = el.value;
  if(myValue > 0){
    el.style.borderColor ='#80c75a';
    document.getElementById(id+'Error').style.display = "none";
     return true;
  }else{
    el.style.borderColor ='#e35152';
    return false;
  }
}

// Validate Select
validateSelect('time');
validateSelect('language');

onblur=“validateSelect（'language'）”

和

onblur=“validateSelect（'time'）”

---

选中fiddle:

如果您没有使用jQuery删除标记，那么如果脚本中没有jQuery，为什么要使用jQuery标记？“我的脚本没有正确显示错误”不是对错误的良好描述。你预计会发生什么？到底发生了什么？您会收到哪些错误消息（如果有）？您有

document.getElementById（'languageError'）

，ID为languageError的元素在哪里？同样，时间错误在哪里？当选择语言选择框而不选择值时，时间选择框中显示错误。当我刷新页面时，选择时没有错误指示。我检查了JS小提琴，但在选择之前它显示红色。当然！这是因为默认情况下，选择中的第一个值是零。如果

myValue

为零，则您的

validateSelect

函数将边框涂成红色。我在站点中替换了代码，但在选择之前和之后都没有显示错误指示。我在默认阶段不需要边框，红色边框的值为0，绿色边框的值大于0。我假设你得到的绿色边框大于0。现在加载时没有颜色-请检查此颜色：。0时会出现红色，但您已将选项的零值标记为禁用的

——就像

。因此，不可能为用户选择零值。是的，但一旦有人尝试选择该框并在没有正确选择的情况下离开，则会以红色显示错误。