javascript - Need to call function 1 time no matter which checkbox is clicked first - some variation of .one() -


i have page many products on it, , products of same type. have built filtering function checkboxes products. when page loads, products load, , checkboxes default un-checked.

goal: when user first clicks checkbox filter products, no matter box clicked, specific function run 1 time, in case, hiding products. when use .one(), working once each checkbox, not desired outcome. need run 1 time, period. no matter checkbox clicked.

below html , jquery, appreciated, , thank time.

html:

<div class="col-md-3 test-one"><label><input id="fourth-cbox" type="checkbox" value="fourth_checkbox" />fourth collection</label></div> <div class="col-md-3 test-one"><label><input id="first-cbox" type="checkbox" value="first_checkbox" />first collection</label></div> <div class="col-md-3 test-one"><label><input id="second-cbox" type="checkbox" value="second_checkbox" />second collection</label></div> <div class="col-md-3 test-one"><label><input id="third-cbox" type="checkbox" value="third_checkbox" />third collection</label></div> 

jquery:

 $(document).ready(function() {    $(".test-one").one('click',function(){      $('div[data-product]').parents("li").hide();   });  }); 

$(document).ready(function() {      var test = true;//set true     $(".test-one").change(function() {       if(test){//will run once during var true         alert('one')         test =false;//set false         }            });     });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div class="col-md-3 test-one"><label><input id="fourth-cbox" type="checkbox" value="fourth_checkbox" />fourth collection</label></div>  <div class="col-md-3 test-one"><label><input id="first-cbox" type="checkbox" value="first_checkbox" />first collection</label></div>  <div class="col-md-3 test-one"><label><input id="second-cbox" type="checkbox" value="second_checkbox" />second collection</label></div>  <div class="col-md-3 test-one"><label><input id="third-cbox" type="checkbox" value="third_checkbox" />third collection</label></div>

do this

  1. set variable true.
  2. check variable if true run function set false.
  3. function not run because variable false.

Comments

Popular posts from this blog

java - nested exception is org.hibernate.exception.SQLGrammarException: could not extract ResultSet Hibernate+SpringMVC -

sql - Postgresql tables exists, but getting "relation does not exist" when querying -

asp.net mvc - breakpoint on javascript in CSHTML? -