I want to run a script on page load first time (for default value of select element), and then on each change of select element. Is it possible to do it in one line, or do I need to duplicate function for this events?
I know that I can use next structure:
$('#element').on('keyup keypress blur change', function() {
...
});
But it doesn't seem to support load event.
Any ideas?
If i understand what you mean, just trigger any one of these events:
$('#element').on('keyup keypress blur change', function() {
...
}).triggerHandler('keyup'); //or trigger('keyup') or keyup() which then let event propagate
Instead of using anonymous functions (defining them right where they will be used) you could just create a regular function and tell jQuery to call it when those events happen.
$(document).ready(myFunction);
$('#element').on('keyup keypress blur change', myFunction);
function myFunction() {
// Do something here...
}
for change element use your :
$('#element').on('change', function() {
...
});
and to use same function on load first time use structure like:
jQuery(window).on("load", function(){
$('#element').change();
});
to call the same function
$('#element').on('keyup keypress blur change', function() {
console.log($(this).val());
}).change();<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="element">
<option value="">Select</option>
<option value="1">BMW</option>
<option value="2">HONDA</option>
<option value="3">FORD</option>
</select>