當DOM完全加載到html中時使用元素

我希望當文檔完全加載時使用我的身體標記的子元素。就像我有當DOM完全加載到html中時使用元素

<body> 
    Country: <br> 
    <div> 
     <datalist id="country"></datalist>   
     <input type="text" list="country" id="search" onmouseover = 'populate("country")'/>   
    </div> 
</body>

在input元素中，我使用onmouseover事件來調用javascript函數。但是我希望在所有元素都完全加載時啓用該功能。

到目前爲止，我在網上看到有一個負載事件，可用於身體標記調用任何特定的功能。但我不想在onload事件上調用任何函數，只是爲了確保在完全加載body時觸發input元素的onmouseover事件。

來源

2016-07-25 Umair Jameel

嘗試$（文件）。就緒（函數（）{}）;函數而不是.. – Karthikeyan

您可以使用jQuery監聽的window負荷事件，然後輸入創建mouseover聽衆，只要所有的媒體滿載：

$(window).on("load", function() { 
    $("#search").on("mouseover", function() { 
     populate("country"); 
    }); 
});

相反window.load的你甚至可以用document.ready。第一個會等到所有其他東西，比如圖像加載完畢。最後只會等到DOM完成...

// $(function() {}) is a shorthand for $(document).ready(function() {}); 
$(function() { 
    $("#search").on("mouseover", function() { 
     populate("country"); 
    }); 
});

來源

2016-07-25 10:40:09 eisbehr

如果我想製作所有元素，不要在窗口加載之前使用。元素可以是任何事件，而不是隻是鼠標懸停。 –

這屬於你的實際項目。一個快速的想法可能是默認隱藏身體，只要頁面加載完成就顯示出來。但正如我所說，這屬於你的項目。一般來說，我不明白爲什麼你必須等到「加載」。這是一個特例... – eisbehr

，你可以在你使用jQuery這個

你的HTML代碼

<body> 
    Country: <br> 
    <div> 
     <datalist id="country"></datalist>   
     <input type="text" list="country" id="search" />   
    </div> 
</body>

JavaScript代碼

$(document).ready(function(){ 
    $("#search").hover(function(){ 
     populate('country'); 
    }); 
});

來源

2016-07-25 10:40:16

請注意，'懸停（）'是不是一個'mouseover'事件 - 它是一個'mouseenter'和'mouseleave'結合 –

@RoryMcCrossan，是的，乾杯.. !!! –

在jQuery中使用

$(document).ready(function(){ 
 
     $('#search').on('mouseenter', function(){ 
 
      console.log('mouse over'); 
 
      }) 
 
    })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
Country: <br> 
 
    <div> 
 
     <datalist id="country"></datalist>   
 
     <input type="text" list="country" id="search" />   
 
    </div>

來源

2016-07-25 10:40:34

當DOM完全加載到html中時使用元素

回答

相關問題