簡體   English   中英

Gijgo Datepicker上個月和下個月的圖標更改

[英]Gijgo Datepicker previous and next month icon change

我正在使用Gijgo Datepicker。 我試圖改變previousnext一個月圖標icomoon圖標,但我沒有找到任何解決的辦法。 對於輸入字段右側的圖標,有一個選項

    icons: {
        rightIcon: '<i class="icon-calendar_today"></i>'
    },

但不適用於下個月或上個月。

這是示例代碼。 我需要像這樣將https://tppr.me/V77Wu更改為<i class="icon-right"></i>

 $('.datepicker').datepicker({ uiLibrary: 'bootstrap4', iconsLibrary: 'glyphicons', format: 'mmmm d yyyy', value: 'April 11th 2019', icons: { rightIcon: '<i class="icon-calendar_today"></i>' }, change: function(dateText, inst) { var date = dateText.target.value.split(' '); var day = date[1]; var suffix = ""; switch(day) { case '1': case '21': case '31': suffix = 'st'; break; case '2': case '22': suffix = 'nd'; break; case '3': case '23': suffix = 'rd'; break; default: suffix = 'th'; } var altDay = date[1] + suffix; date[1] = altDay; var newDate = date.join().replace(/,/g, " "); $(".datepicker").val(newDate); } }); 
 <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> <link href="https://unpkg.com/gijgo@1.9.13/css/gijgo.min.css" rel="stylesheet"/> <script src="https://unpkg.com/gijgo@1.9.13/js/gijgo.min.js"></script> <input type="text" class="form-control datepicker"> 

這是簡單的js。 一種方法。 希望能幫助到你。 您也可以使用jQuery,因為您已經在使用它。

它在這里用類'glyphicon-chevron-right'替換了第一個元素,也許最好用jquery定位它。

 var e = document.getElementsByClassName('glyphicon-chevron-right')[0]; var d = document.createElement('i'); d.innerHTML = e.innerHTML; e.parentNode.replaceChild(d, e); d.classList.add("icon-calendar_today"); 
 <span class="glyphicon glyphicon-chevron-right"></span> 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM