选择onChange在表单中不起作用

Question

我有一个关于表单提交和onchange事件无法一起使用的问题。当我更改下拉列表上的值时，事件viewroom（）未触发。有人可以帮我吗？代码如下

<script type="text/javascript">
function viewroom()
{
    alert(123);
}
</script>

<form id="myform" name="myform" action="joinroom.php" method="post">
<select name="viewroom" id="viewroom" onChange="viewroom()">
    <option value="1">Room1 </option>
    <option value="2">Room2 </option>
</select>
<input type="submit" onclick="this.form.submit()" value="Join room"><br>
</form>

Answer 1

您的函数名称与name的id和select冲突，只需为函数指定另一个名称。

Answer 2

您不能为函数命名与页面上的元素相同。我建议将函数名称更改为viewroomSelected之类，如图here in this jsFiddle所示。

相关更改：

function viewroomSelected()
{
  alert(123);
}

<select name="viewroom" id="viewroom" onChange="viewroomSelected()">

Answer 3

我发现，当您将name和id属性设置为与函数名相同时，会导致此冲突，并提示错误viewroom不是函数，请更改函数名。还可以在文档底部定义您的js。

function viewRoom()
{
    alert(123);
}

Working Demo

Answer 4

更改

<select name="viewroom" id="viewroom" onChange="viewroom()">

to

<select name="viewroom" id="viewroom" onChange="()=>viewroom()">