$（window）.on（'load'，…）在MS Edge中發生得太早

Question

我正在使用Microsoft Edge 44.17763.1.0，Microsoft EdgeHTML 18.17763。

加載頁面時，我無法讓Edge觸發選擇選項更改事件。

我有一個select下拉框，當內容更改時，它會自動使用所選文本填充div 。 我想要的是此頁面在首次加載時自動執行此操作。 也就是說，頁面加載，初始化select下拉框，然后自動將現有選擇填充到div ，而無需單擊它。

jQuery將在select下拉列表的.change事件中自動更新div 。 當用戶使用鼠標更改選擇框的內容時，此方法可以正常工作。 選擇選項在第一次打開頁面時初始化，因此我將選擇選項初始化放在$(document).ready事件中，然后我想在頁面加載時自動觸發選擇更改事件，但是在select下拉菜單后已初始化，因此我將觸發器放入$(window).on('load', ...事件。

<html>
<head>
<title>Test</title>
<script language="javascript" type="text/javascript" src='/script/jquery-3.4.0.min.js'></script>
<script language="javascript" type="text/javascript">
$(function () {
  var entries = ['fred', 'barney', 'betty', 'wilma'];

  $.each(entries, function() {
    $('#foo_select').append($("<option />").val(this).text(this));
  });

  $('#foo_select').change(function() {
    $('#text').text($(this).val())
  })

  $('#text').empty()
})

$(window).on('load', function() {
  $('#foo_select').trigger('change')
})

</script>
</head>
<body>
  <select id='foo_select'>
  </select>
  <p>
  <div id='text' style='width: 100px'></div>
  </p>
</body>
</html>

我基於已閱讀的有關這兩個事件的信息，以這種方式編寫了代碼，其摘要總結在窗口加載和文檔就緒功能與Windows onload與文檔就緒之間的區別。 此代碼可在Firefox和Chrome中正常運行。 但是，它在Microsoft Edge中不起作用。 我確實確定load事件在Edge中觸發，它看起來（可能）為時過早，就像在下拉列表初始化之前一樣，因此觸發操作什么也不做。

根據我在這里想要做的事情，這是不正確的方法，還是Edge有問題？

附錄：幾個不錯的答案給了我一些選擇，但是問題仍然是為什么為什么原始事件中的load事件在這種情況下不起作用。

Answer 1

您已經在使用JQuery的“就緒”回調，該回調確定何時加載文檔以及 DOM是否准備好進行操作。 您可以只將觸發事件放在那里。

 $(function() { var entries = ['fred', 'barney', 'betty', 'wilma'] $.each(entries, function() { $('#foo_select').append($('<option />').val(this).text(this)); }) $('#foo_select').change(function() { $('#text').text($(this).val()) }) $('#text').empty() $('#foo_select').trigger('change') })

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <select id="foo_select"></select> <p id="text"></p>

Answer 2

為什么在創建選項時不簡單地“觸發”它？
加載文檔后觸發它有什么好處？

如果不是，只需從頭開始應用“起始值”。

// use this
$('#text').text($('#foo_select').val())
// instead of
$('#text').empty()

（希望代碼是正確的，我不使用JQuery-但您收到消息了：））

$（window）.on（'load'，…）在MS Edge中發生得太早

問題描述

2 個解決方案

解決方案1
3 已采納 2019-04-17 23:40:37

解決方案2
1 2019-04-18 00:03:51

$（window）.on（&#39;load&#39;，…）在MS Edge中發生得太早

問題描述

2 個解決方案

解決方案1 3 已采納 2019-04-17 23:40:37

解決方案2 1 2019-04-18 00:03:51

$（window）.on（'load'，…）在MS Edge中發生得太早

解決方案1
3 已采納 2019-04-17 23:40:37

解決方案2
1 2019-04-18 00:03:51