jquery - JavaScript & Checkboxes - More efficient way of storing values of each checkbox? -
is there more efficient way of storing checkbox values?
each checkbox has assigned value, wondering if there better way of storing these values (destinationoflink1,2,3,etc)? perhaps store them array , call them?...although unsure
html page extract:
<form> <label for="checkbox1">link #1</label> <input type="checkbox" id="checkbox1" value="http://www.destinationoflink1.com"> <label for="checkbox2">link #2</label> <input type="checkbox" id="checkbox2" value="http://www.destinationoflink2.com"> <label for="checkbox3">link #3</label> <input type="checkbox" id="checkbox3" value="http://www.destinationoflink3.com"> <input type="button" value="open links" id="open_link"/> </form>
javascript file extract (if useful):
$("#open_link").click(function() { performopenlink(); }) function performopenlink(){ $("input[type=checkbox]").each(function() { if (this.checked) { window.open(this.value) } }); }
you generate checkboxes dynamically using array
modified html
<form> <div id="checkbox_container"></div> <input type="button" value="open links" id="open_link"/> </form>
modified javascript
var destinations = [ {'label': 'checkbox1', 'value' : 'http://www.destinationoflink1.com'}, {'label': 'checkbox2', 'value' : 'http://www.destinationoflink2.com'}, {'label': 'checkbox3', 'value' : 'http://www.destinationoflink3.com'} ]; $(function(){ // document onready (var i=0; i<destinations.length; i++){ // add label: $('#checkbox_container').append('<label for="' + destinations[i].label + '">link #' + + '</label>'); // add checkbox: $('#checkbox_container').append('<input type="checkbox" id="'+ destinations[i].label+'" value="' + destinations[i].value + '" >'); } }); $("#open_link").click(function() { performopenlink(); }); function performopenlink(){ $("input[type=checkbox]").each(function() { if (this.checked) { window.open(this.value) } }); }
this loop through array , build label
, checklist
html based on properties of each array item. placing values array, should easier add (or remove) new checklist values later
here's jsfiddle
update: fixed issue left this
in code. replaced destinations[i]
Comments
Post a Comment