dimanche 9 septembre 2018

Use checkboxes to display objects with certain tags (jquery)

I have a bunch of checkboxes on my site that all have unique ids. I want to use jquery to display html objects that have tags that match these ids. So if the user clicks "peaceful" it will display all the html objects that have "peaceful" as a tag. (i've added the tags manually in the html) Hopefully this makes sense. Here is the html code for the check boxes:

div class="col-md-6 center checks" id="mood">
                  <input type="checkbox" id="contemplative" > <span class="check">Contemplative</span>
               <input type="checkbox" id="peaceful">  <span class="check">Peaceful</span>
             <input type="checkbox"  id="aggresive"> <span class="check">Aggressive</span>
              <input type="checkbox"  id="heartbreak">  <span class="check">Heartbreak</span><br>
              <input type="checkbox" id="dark">  <span class="check">Dark</span> 
              <input type="checkbox"  id="epic">  <span class="check">Epic</span>
            <input type="checkbox" id="cheerful">  <span class="check">Cheerful</span>
              <input type="checkbox"  id="fun">  <span class="check">Fun</span><br>
              <input type="checkbox" id="atmospheric"> <span class="check">Atmospheric</span>
              <input type="checkbox"  id="upbeat">  <span class="check">Upbeat</span>
              <input type="checkbox" id="heartful">  <span class="check">Heartfelt</span> 
              <input type="checkbox" id="sad">  <span class="check">Sad</span> <br>
             </div>




Aucun commentaire:

Enregistrer un commentaire