選擇選項更改時觸發點擊按鈕無法正常工作

Question

每當狀態更改時，我就有以下代碼來觸發對按鈕的單擊：

$('#selectstate').on('change', function(){
    $("[name='update']:submit").trigger("click");
});

它工作正常，但問題是我必須完全單擊列表中的箭頭，如下所示。 如果單擊空白以顯示列表，該按鈕將自動觸發。 有什么解決辦法嗎？

---

示例HTML代碼：

<select id="selectstate" name="state">

<option value="Alabama">Alabama</option>
<option value="Kansas">Kansas</option>
<option value="Kentucky">Kentucky</option>

</select>

<input type="submit" value="Update" name="update" />

Answer 1

我認為您只需提交表格即可。

var yourForm = document.forms["update"];  // your form name is "update"
yourForm.submit();

如果您真的想在更改選擇框時單擊，則創建一個click事件並觸發它。

var selectBox = document.getElementById("yourSelect");
selectBox.onchange = function()
{
  // call the fireClick function passing the element
  fireClick(link); // pass the element in which you want to trigger
}


function fireClick(element)
{
  var ev = document.createEvent("MouseEvents");
  ev.initMouseEvent("click", true, false, self, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
  element.dispatchEvent(ev);
}

更簡單的方法

selectBox.onchange = function()
{
  var submitButton = document.getElementById("button");
  submitButton.click();
}