复选框值未在 Firefox 中获取，但在 chrome 中有效

Question

我正在处理一个下拉菜单，我想借此获取用户在下拉列表中选择的选项的值。它在 Chrome 上使用 onmousedown 事件运行良好，但在 Firefox 上不起作用，该值在 Chrome 中得到提醒，但在 Firefox 上没有。请协助？

布局

<div class="check-now" style="width: 100%;">
      <h1 class="cover-travel">Child(ren)</h1>
          <select name="child" id="child" onmousedown="this.value='';" onchange="checkChild(this.value)">
            <option value="0">None</option>
            <option value="1">1</option>
            <option value="2"> 2</option>
            <option value="3"> 3 </option>
            <option value="4"> 4 </option>
            <option value="5"> 5 </option>
         </select> 
    </div>

被调用的函数在 Chrome 但在 Firefox 中运行良好

function checkChild(val) {
      alert(val);
      //Child One
      if (val == 1){
         //Add code
      }
      //Child Two
      else if (val == 2){
        //Add code 2
      }
      //Child Three
      else if(val == 3){
        //Add code 3
      }
      //Child Four
      else if(val == 4){
        //Add code 4
      }
      //Child Five
      else if(val == 5){
        //Add code 5
      }
      else{
         //Else code
      }
    }

Answer 1

我建议不要写内联 javascript。而是将 eventListener 添加到您的 select:

var mySelect = document.getElementById('child');

mySelect.addEventListener('change', function(e) {

  if (this.value == 1) {
    console.log('val is 1');
  } else if (this.value == 2) {
    console.log('val is 2');
  } else if (this.value == 3) {
    console.log('val is 3');
  } else if (this.value == 4) {
    console.log('val is 4');
  } else if (this.value == 5) {
    console.log('val is 5');
  } else {
    console.log('val not specified');
  }

});

<div class="check-now" style="width: 100%;">
  <h1 class="cover-travel">Child(ren)</h1>
  <select name="child" id="child">
    <option value="0">None</option>
    <option value="1">1</option>
    <option value="2"> 2</option>
    <option value="3"> 3 </option>
    <option value="4"> 4 </option>
    <option value="5"> 5 </option>
  </select> 
</div>

复选框值未在 Firefox 中获取，但在 chrome 中有效

Checkbox value not being fetched in Firefox but works in chrome

javascript

firefox

events

onchange

onmousedown