jquery隐藏div没有显示在加载页面

问题描述：

下面的代码可以正常工作，但在使用默认选定值（opt3）加载页面时不起作用。

我该如何获得第一次加载jQuery的div id＃opt3 diplayed？

<body> 

     <div> 

     <p> 

       <select name="routing-sel" id="routing"> 

         <option value="opt1">opt1</option> 

         <option value="opt2">opt2</option> 

         <option value="opt3" selected>opt3</option> 

         <!-- the selected value will be dynamically generated by PHP--> 

       </select> 

       </p> 

     </div> 



     <div id="opt1" class="form" style="display:none"> 

       <p>opt1 selected</p> 

     </div> 

     <div id="opt2" class="form" style="display:none"> 

       <p>opt2 selected</p> 

     </div> 

     <div id="opt3" class="form" style="display:none"> 

       <p>opt3 selected</p> 

     </div> 



     <script src="jquery-1.11.3.min.js"></script> 



     <script> 

     $(document).ready(function() { 

       $('select#routing').change(function() { 

         $('.form').hide(); 

         $('#' + $(this).val()).show(); 

       }); 

     }); 

     </script> 

</body>

'$（ '＃' + $（ '＃选择路由'）。VAL（））。节目（） ;'？ –

答

你可以这样说：

$(document).ready(function() { 

      $('#' + $("#routing").val()).show(); // Show default chosen option on load 

      $('select#routing').change(function() { 

        $('.form').hide(); 

        $('#' + $(this).val()).show(); 

      }); 

    });

http://jsfiddle.net/sandenay/8zewxp7r/

答

只需修改您的document.ready了这一点。这将工作..

$（文件）。就绪（函数（）{

$('#' + $('select#routing').val()).show(); 

      $('select#routing').change(function() { 

        $('.form').hide(); 

        $('#' + $(this).val()).show(); 

      }); 

    });

jquery隐藏div没有显示在加载页面

相关推荐