onchange事件無法在javascript的首次更改時觸發？

Question

<form class="uk-form-stacked">
    <label class="uk-form-label" for="kUI_dropdown_basic_select">Select a user</label>
    <select id="kUI_dropdown_basic_select" class="uk-form-width-medium" onchange="getIPL();">
        <?php  foreach ($response->result->allAcc as $data) { ?>
            <option  value="<?php echo $data->Id;?>">   <?php echo $data->Name; ?></option>
        <?php } ?>
    </select>
</form>


<script>
function getIPL() {
    var urlmenu = document.getElementById( 'kUI_dropdown_basic_select' );
    urlmenu.onchange = function() {
    window.open( 'admin_mailbox.php?Id=' + this.options[ this.selectedIndex ].value,"_self");
    };
}
</script>

感謝您抽出寶貴時間閱讀我的問題。 onchange()第一次無法正常工作，第二次正常

Answer 1

從select框中刪除onchange 。 並通過以下方式更改您的JS：

<script>

    var urlmenu = document.getElementById( 'kUI_dropdown_basic_select' );
    urlmenu.onchange = function() {
    window.open( 'admin_mailbox.php?Id=' + this.options[ this.selectedIndex ].value,"_self");
    };

</script>

Answer 2

下面的代碼非常簡單

<form class="uk-form-stacked">
   <label class="uk-form-label" for="kUI_dropdown_basic_select">Select a user</label>

   <select id="kUI_dropdown_basic_select" onmousedown="this.value='';" class="uk-form-width-medium" onchange="getIPL(this.value);">
      <option  value="aaa">aaa</option>
      <option  value="bbb">bbb</option>
      <option  value="ccc">ccc</option>
      <option  value="ddd">ddd</option>
   </select>
</form>

javascript功能

function getIPL(value) {
  //var urlmenu = document.getElementById( 'kUI_dropdown_basic_select' );
  //urlmenu.onchange = function() {
  window.open( 'admin_mailbox.php?Id=' + value,"_self"); 
  //};
}

Answer 3

當您使用document.getElementById獲取元素ID時，無需在<select>使用onchange()事件。

而且我還建議您為選擇<option>Select</option>添加更多選項

測試示例（根據您的PHP代碼進行更改）：

 var urlmenu = document.getElementById( 'kUI_dropdown_basic_select' ); urlmenu.onchange = function() { window.open( 'admin_mailbox.php?Id=' + this.options[ this.selectedIndex ].value,"_self"); }; 

 <form class="uk-form-stacked"> <label class="uk-form-label" for="kUI_dropdown_basic_select">Select a user</label> <select id="kUI_dropdown_basic_select" class="uk-form-width-medium"> <option value="">Select</option> <option value="test1">Test1</option> <option value="test2">Test2</option> </select> </form> 

Answer 4

您已經在此處定義了選擇框的onchange事件...然后為什么要在同一元素上再次使用onchange事件。

使用以下代碼

<form class="uk-form-stacked">
    <label class="uk-form-label" for="kUI_dropdown_basic_select">Select a user</label>
    <select id="kUI_dropdown_basic_select" class="uk-form-width-medium">
        <?php  foreach ($response->result->allAcc as $data) { ?>
            <option  value="<?php echo $data->Id;?>">   <?php echo $data->Name; ?></option>
        <?php } ?>
    </select>
</form>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){
  $("#kUI_dropdown_basic_select").change(function(){
        window.open( 'admin_mailbox.php?Id=' + $(this).val() ,"_self");
  });
});
</script>