javascript - jQuery show hide div based on select value with loading-how to add loading element in this code -


how add loading function in code? modify please.

$(function() {      $('#colorselector').change(function() {          $('.colors').hide();          $('#' + $(this).val()).show();      });  });
<select id="colorselector">      <option value="red">red</option>      <option value="yellow">yellow</option>      <option value="blue">blue</option>  </select>  <div id="red" class="colors" style="display:none">ok janu love </div>  <div id="yellow" class="colors" style="display:none"> yellow.. </div>  <div id="blue" class="colors" style="display:none"> blue.. </div>

just include jquery:

$(function() {              $('#colorselector').change(function(){                  $('#loading').show();                  $('.colors').hide();                  $('#loading').hide();                  $('#' + $(this).val()).show();              });          });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <select id="colorselector">         <option value="red">red</option>         <option value="yellow">yellow</option>         <option value="blue">blue</option>      </select>      //output       <div id="red" class="colors" style="display:none">ok janu love </div>      <div id="yellow" class="colors" style="display:none"> yellow.. </div>      <div id="blue" class="colors" style="display:none"> blue.. </div>      <div id="loading" style="display:none">loading...</div>


Comments

Popular posts from this blog

python Tkinter Capturing keyboard events save as one single string -

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

javascript - Z-index in d3.js -