Как вызвать функцию jquery при загрузке страницы?

Question

У меня есть следующая функция:

$('#borderColor').on('change', function() {
  // update inventory
  updateInventory(this.options[this.selectedIndex].text);  
});

Как я могу автоматически вызвать эту функцию при загрузке страницы?

Answer 1

Просто вызвать событие изменения при выборе на странице загрузки. Таким образом, вам не нужно писать повторяющийся код, и все обрабатывается в одном месте.

с помощью $ ('# selector'). Trigger () вы можете вызвать любое событие, например change, click, input, et c ... вы слушаете.

С помощью $(document).ready(function() { /** your code here **/}) вы можете установить код, который вы будете запускать sh после завершения загрузки и рендеринга страницы.

function updateInventory(value) {
  $('#inventory').text(value);
}
$('#borderColor').on('change', function() {
  // update inventory
  updateInventory(this.options[this.selectedIndex].text);  
});
$(document).ready(function() {
  $('#borderColor').trigger('change');  
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="borderColor">
<option value="red">red</option>
<option value="blue" selected="selected">blue</option>
</select>
<div id="inventory">
</div>

Answer 2

Вы слышали jquery триггер ?

$(function() {
  $('#borderColor').trigger('change')
});