How to turn this into a global javascript function effecting all values

This code loads via jQuery a page based onclick events of checkboxes.

function product_analysis(address, box) {
    if (box.checked) {
        $('#product_' + box.alt).load(address);
    } else {
        $('#product_' + box.alt).load('http://www.divethegap.com/update/blank2.html');
    }
    document.getElementById('product_quantity_PRI_' + box.alt).value = box.value;
};

With the onclick event looking as follows onclick="product开发者_如何转开发_analysis('http://www.samedomain.blahblahblah', this)

What I need is that for all checkboxes that are already ticked on page load to have this function applied to them all. I am reasonably confident with javaScript but when it comes to objects and arrays I get lost.

Many Thanks,

You can use this code to find all the checkboxes that are currently checked:

$(':checkbox:checked')

If you then want to do something to all of them, you can use the each function like this:

$(':checkbox:checked').each(function() {

  // alerts the checkbox for example
  // "this" referes to the checkbox, one after the other
  alert(this); 

})

Or to do what you asked for ("for all checkboxes that are already ticked on page load to have this function applied to them all"):

$(':checkbox:checked').each(function() {

  product_analysis("someaddress", this);

})

EDIT: To address the second issue (not a part of the original question, but to the comments below):

I will assume that you have fields like this in your markup. Use some meaningful IDs rather than my stupid examples of course.

<input type="checkbox" id="foo" />
<input type="checkbox" id="bar" />
<input type="checkbox" id="baz" />

Then you'll put the following in your JS:

var addresses = {
   foo: 'some_address',
   bar: 'some_other_address',
   baz: 'yet_another_one'
};

$(':checkbox:checked').each(function() {
  product_analysis(addresses[this.id], this);
})

That will invoke product_analysis with the address that corresponds to the ID of the checkbox.

EDIT (again):

There is actually a way to add meta-data directly to the html-tags that I wasn't aware of. You can add attributes prefixed by "data-" to your tag, like this:

<input type="checkbox" data-address="someaddress" data-foo="something else" data-bar="more data!" />

You can read more about it on John Resigs blog.

this is required script

$().ready(function(){
    var box, address;
    $(":checkbox").each(function(){
           box = this;
           if (box.checked) {
               address = ""; //you can set address either in hidden fields or in metadata
               $('#product_' + box.alt).load(address);
           }
           else {
                $('#product_' + box.alt).load('http://www.divethegap.com/update/blank2.html');
           }           
           document.getElementById('product_quantity_PRI_' + box.alt).value = box.value;
    });
});

You need to check how many number of check is checked and then invoke your code.

var checkLength = checkObj.length;

for(var i = 0; i < checkLength ; i++) {
 if(radioObj[i].checked) {
 }
// here your code base on check box status
}

If you have a class called as "selected" when the check box are checked, you could do something like this

$('.selected').function(element){product_analysis(address, element)};

Thanks chaps for all your help here is I I got it. Jakob will probably consider this a hack but it is a data driven site and based on my limited technical knowledge can't be tasked with modifying a JS file every time we add a new product.

function product_analysis_global() {

    $(':checkbox:checked').each(function() {
    $('#product_' + this.alt).load(this.title);
});
}

function product_analysis(box) {
    if (box.checked) {

    $('#product_' + box.alt).load(box.title);

    }
    else {

    $('#product_' + box.alt).load('http://www.divethegap.com/update/blank2.html');
    }
    document.getElementById('product_quantity_PRI_' + box.alt).value = box.value;


};