jquery怎么實現(xiàn)二級聯(lián)動效果

發(fā)布時間：2022-03-31 10:18:19 來源：億速云閱讀：407 作者：iii 欄目：開發(fā)技術(shù)

這篇文章主要介紹“jquery怎么實現(xiàn)二級聯(lián)動效果”，在日常操作中，相信很多人在jquery怎么實現(xiàn)二級聯(lián)動效果問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”jquery怎么實現(xiàn)二級聯(lián)動效果”的疑惑有所幫助！接下來，請跟著小編一起來學(xué)習(xí)吧！

具體代碼如下

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
   <title>二級聯(lián)動</title>
   <script src="http://apps.bdimg.com/libs/jquery/1.8.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(document).ready(function(){
      $("#province").change(function(){
       $("#province option").each(function(i,o){
          if($(this).attr("selected"))
          {
           $(".city").hide();
           $(".city").eq(i).show();
         }
       });
      });
    $("#province").change();
   });
</script>
</head>
<body>
   <select id="province">
    <option>----請選擇省份----</option>
    <option>北京</option>
   <option>上海</option>
    <option>江蘇</option>
  </select>
  <select class="city">
      <option>----請選擇城市----</option>
  </select>
  <select class="city">
    <option>東城</option>
    <option>西城</option>
    <option>崇文</option>
    <option>宣武</option>
    <option>朝陽</option>
  </select> 
<select class="city">
    <option>黃浦</option>
    <option>盧灣</option>
    <option>徐匯</option>
    <option>長寧</option>
    <option>靜安</option>
  </select>
  <select class="city">
    <option>南京</option>
    <option>鎮(zhèn)江</option>
    <option>蘇州</option>
    <option>南通</option>
    <option>揚州</option>
  </select>
</body>
</html>

到此，關(guān)于“jquery怎么實現(xiàn)二級聯(lián)動效果”的學(xué)習(xí)就結(jié)束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學(xué)習(xí)，快去試試吧！若想繼續(xù)學(xué)習(xí)更多相關(guān)知識，請繼續(xù)關(guān)注億速云網(wǎng)站，小編會繼續(xù)努力為大家?guī)砀鄬嵱玫奈恼拢?/p>

向AI問一下細節(jié)

jquery怎么實現(xiàn)二級聯(lián)動效果

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標簽