Javascript更改警报(显示错误)

Question

尝试从select通知所选选项，但它没有发出警报。

它显示了一个错误：

{“消息”："Uncaught :无法读取空的属性值“，”文件名“："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;
}

在select标记中添加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>

另外，请关注您的嵌套-if部分。因为它不能用。

Answer 2

如果使用document.getElementById("item1")，则在<select>元素中添加id="item1"。

Answer 3

只需使用$('#item1').val()

function selectOption() {
    var x = $('#item1').val();
    var option = $('#item1 option');
    alert("You selected: " + x);

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

    return false;
}

#item1指的是ID，您只在name中指定了这个ID。

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

您还忘记了定义option，$('#item1 option')可以这样做。