jquery hide() not working in chrome -
i use jquery popup dialog, , in dialog have input , select box, want hide options in select box, worked in ff, not worked in chrome .
<input type="text" onkeyup="search(this.value)" > <select id="cl_sel_l" multiple="multiple"> <option value='2' id='c_2'>aa</option> <option value='3' id='c_3'>bb</option> <option value='4' id='c_4'>cc</option> <option value='5' id='c_5'>dd</option> </select>
var clients = new array(); clients[2] ='aa'; clients[3] ='bb'; clients[4] ='cc'; clients[5] ='dd'; function search(val) { ( var in clients) { if (clients[i].tolowercase().search(val.tolowercase()) == -1) { $("#cl_sel_l").find("#c_" + i).hide(); } else { $("#cl_sel_l").find("#c_" + i).show(); } } }
display: none
(which jquery's hide()
function matched elements) not work option
elements in reliable, cross-browser manner. instead, need remove them dom, , add them in after search.
this little tricky, need store original order. i'd tempted delete non-matches, , restore. this:
var clients = new array(); clients[2] ='aa'; clients[3] ='bb'; clients[4] ='cc'; clients[5] ='dd'; var restore; function search(val) { $('#cl_sel_l').html(restore); ( var in clients) { if (clients[i].tolowercase().search(val.tolowercase()) == -1) { $("#c_" + i).remove(); } } } $(function() { restore = $('#cl_sel_l').html(); });
see jsfiddle
Comments
Post a Comment