如何在参数onload或dom准备就绪后调用函数？

Question

I have the following function that takes a selected value and runs it onclick. I will still leave it that way. However, client wants to have a default selected value which should run the function and this function makes changes on the page.

So how should I run this function by taking pre-selected value and run it after dom is ready without clicking anything?

var value = $("#market-select option:selected").text(); // this takes value of pre-selected item
vizFilter1(value); // and I want to call this function after dom is ready or onload after passing values. 

I tried it this way but it is not doing anything.

$(document).ready(function (){

function run (){
var value = $("#market-select option:selected").text();
vizFilter1(value);

}

}); 

How to run this after page has been loaded without requiring the user to do anything?

Answer 1

If you want to be able to run those two lines of code from multiple places, eg, from a click handler and on DOM ready, wrap them in a function (as you've done) and then call that function from your DOM ready handler. Or simply bind the function as the ready handler:

function run (){
  var value = $("#market-select option:selected").text();
  vizFilter1(value);
}

$(document).ready(function (){
  run();
  // do other on ready things here if required
});

// OR, if you don't need to do other things:
$(document).ready(run);

In the attempt you showed, you declared a run() function but never called it. Though it is fine to define the function inside your ready handler as long as you then call it - that may be preferable as it keeps the function out of global scope.