Javascript 更改警报(显示错误)

Question

尝试从 select 中提醒选定的选项，但它没有提醒。

显示错误:

{ "message": "Uncaught TypeError: Cannot read property 'value' of null", "filename": "https://stacksnippets.net/js", "lineno": 18,
"colno": 43 }

我尝试过:

function selectOption() {
  var x = document.getElementById("item1").value;
  alert("You selected: " + x);
  if (option == "Item") {

    return true;
  } else if (option == "ZZ2017TF11A1") {
    return true;
  } else if (option == "ZZ2017TF11A2") {
    return true;
  }

  return false;
}

<select class="country" name="item1" onChange="selectOption()">
  <option value="Select Item">Item</option>
  <option value="ZZ2017TF11A1">Shirt</option>
  <option value="ZZ2017TF11A2">Pant</option>
</select>

如何解决？

Answer 1

如果您需要使用纯 JavaScript(没有 jQuery)来执行此操作，您可以尝试此操作。我做了一些更改以使代码更容易理解。

function selectOption() {
  var elem = document.getElementById("item1");

  // get selected option value
  var selectedOptVal = elem.options[elem.selectedIndex].value;
  alert("You selected: " + selectedOptVal);

  // get selected option text
  var selectedOptTxt = elem.options[elem.selectedIndex].text;

  if (selectedOptTxt == "Item") {
    return true;
  } else if (selectedOptTxt == "ZZ2017TF11A1") {
    return true;
  } else if (selectedOptTxt == "ZZ2017TF11A2") {
    return true;
  }

  return false;
}

在选择标记内添加 id 字段。

<select class="country" id="item1" name="item1" onChange="selectOption()">
  <option value="Select Item">Item</option>
  <option value="ZZ2017TF11A1">Shirt</option>
  <option value="ZZ2017TF11A2">Pant</option>
</select>

另外，请关注您的nested-if部分。因为它无法使用。