一区二区三区在线-一区二区三区亚洲视频-一区二区三区亚洲-一区二区三区午夜-一区二区三区四区在线视频-一区二区三区四区在线免费观看

服務器之家:專注于服務器技術及軟件下載分享
分類導航

node.js|vue.js|jquery|angularjs|React|json|js教程|

服務器之家 - 編程語言 - JavaScript - jquery - 原生jQuery實現只顯示年份下拉框

原生jQuery實現只顯示年份下拉框

2021-12-18 17:55一個月改一次yeah jquery

這篇文章主要介紹了原生jQuery實現只顯示年份下拉框,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下

本文實例為大家分享了jQuery實現只顯示年份下拉框的具體代碼,供大家參考,具體內容如下

代碼:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>Document</title>
  <script src="https://lib.baomitu.com/jquery/3.5.1/jquery.js"></script>
</head>
<body>
 <div id="main" style="width: 600px;height:400px;"></div>
 <select name="" id="start" onchange="chooseYear2()">
  <option value="">1949</option>
 </select>
 
 <select name="" id="end">
 <option value=""></option>
 </select>
 
 <script type="text/javascript">
  var date = new Date();
  var y = date.getFullYear()
  function chooseYear1() {
   for (let i = 1949; i<=y; i ++) {
    let start = document.getElementById("start");
    let year = Number(start.lastElementChild.innerHTML) + 1;
    var myOption = document.createElement("option");
    myOption.innerHTML = year;
    start.appendChild(myOption);
   }
  }
  chooseYear1();
  function chooseYear2() {
  //如果你想讓起始年份下拉框和結束年份下拉框都顯示從1949至今的年份,那么寫同樣的循環即可:
   let end = Number($("#start").find("option:selected").val());
   let start = document.getElementById("end");
   start.firstElementChild.innerHTML=end;
   var myOption = document.createElement("option");
   for (let i = end; i<=y; i ++) {
    let start = document.getElementById("end");
    let year = Number(start.lastElementChild.innerHTML) + 1;
    var myOption = document.createElement("option");
    myOption.innerHTML = year;
    start.appendChild(myOption);
   }
  }
 </script>
</body>
</html>

只顯示年份的下拉框效果:

原生jQuery實現只顯示年份下拉框

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持服務器之家。

原文鏈接:https://blog.csdn.net/weixin_42952297/article/details/111567326

延伸 · 閱讀

精彩推薦
  • jqueryjQuery使用hide()、toggle()函數實現相機品牌展示隱藏功能

    jQuery使用hide()、toggle()函數實現相機品牌展示隱藏功能

    這篇文章主要介紹了jQuery使用hide()、toggle()函數實現相機品牌展示隱藏功能,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考...

    Schieber11822022-01-11
  • jqueryjquery插件實現搜索歷史

    jquery插件實現搜索歷史

    這篇文章主要為大家詳細介紹了jquery插件實現搜索歷史,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下...

    阿飛超努力8462022-03-09
  • jqueryjQuery treeview樹形結構應用

    jQuery treeview樹形結構應用

    這篇文章主要為大家詳細介紹了jQuery treeview樹形結構應用,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下...

    Lqq77s9342022-02-20
  • jqueryjquery實現穿梭框功能

    jquery實現穿梭框功能

    這篇文章主要為大家詳細介紹了jquery實現穿梭框功能,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下...

    陳濤輝8412022-01-04
  • jqueryjquery插件實現圖片懸浮

    jquery插件實現圖片懸浮

    這篇文章主要為大家詳細介紹了jquery插件實現圖片懸浮,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下...

    阿飛超努力5802022-03-03
  • jqueryjQuery實現本地存儲

    jQuery實現本地存儲

    這篇文章主要為大家詳細介紹了jQuery實現本地存儲,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下...

    李大璟10682021-12-16
  • jqueryjQuery實現鼠標拖動圖片功能

    jQuery實現鼠標拖動圖片功能

    這篇文章主要介紹了jQuery實現鼠標拖動圖片功能,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以...

    lucascube5812022-02-10
  • jqueryjQuery是用來干什么的 jquery其實就是一個js框架

    jQuery是用來干什么的 jquery其實就是一個js框架

    jQuery是一bai個簡潔而快速的JavaScript庫,可用于du簡化zhi事件處理,HTML文檔遍歷,Ajax交互和dao動畫,以更快速開發網站...

    jQuery教程網8842022-01-17
主站蜘蛛池模板: 丁香六月色婷婷综合网 | 国产成人盗拍精品免费视频 | 午夜AV亚洲一码二中文字幕青青 | 午夜国产精品视频在线 | 香港三级系列在线播放 | 97精品国产高清在线看入口 | 日韩亚洲欧美一区二区三区 | 欧美brazzers| 国产色综合久久五月色婷婷中文 | 华人亚洲欧美精品国产 | 色婷婷在线 | 99视频在线观看免费视频 | 成人影院视频 | 成年人视频免费在线观看 | 色综合色综合 | 亚洲国产精品久久网午夜 | 成人免费淫片95视频观看网站 | 爱爱小视频免费看 | 黑人与欧洲女子性大战 | 3d动漫h在线观看网站蜜芽 | 精品成人一区二区三区免费视频 | 欧美亚洲桃花综合 | 久草热8精品视频在线观看 久草草在线视视频 | 毛片视频在线免费观看 | 国产精品www夜色影视 | 免费国产成人高清视频网站 | 女娃开嫩苞经历小说 | 亚州精品视频 | 星空无限传媒xk8027穆娜 | 四虎影视4hu最新地址在线884 | 国产不卡视频 | 国产欧美日韩图片一区二区 | 亚洲欧美精品一区二区 | 麻豆网站在线免费观看 | 日本午夜影院 | 国产精品免费久久久久影院小说 | 成人网址大全 | 男人桶女下面60分钟视频 | 亚洲精品一 | 婷婷综合缴情亚洲五月伊 | 国产大片免费在线观看 |