我有一個像這樣的選擇菜單:第一個option標簽是我的占位符,如果我單擊選擇菜單,它就會被停用。$('select').each(function(){ var $this = $(this), numberOfOptions = $(this).children('option').length; $this.addClass('select-hidden'); $this.wrap('<div class="select"></div>'); $this.after('<div class="select-styled"></div>'); var $styledSelect = $this.next('div.select-styled'); $styledSelect.text($this.children('option').eq(0).text()); var $list = $('<ul />', { 'class': 'select-options' }).insertAfter($styledSelect); for (var i = 0; i < numberOfOptions; i++) { $('<li />', { text: $this.children('option').eq(i).text(), rel: $this.children('option').eq(i).val() }).appendTo($list); } var $listItems = $list.children('li'); $styledSelect.click(function(e) { e.stopPropagation(); $('div.select-styled.active').not(this).each(function(){ $(this).removeClass('active').next('ul.select-options').hide(); }); $(this).toggleClass('active').next('ul.select-options').toggle(); }); $listItems.click(function(e) { e.stopPropagation(); $styledSelect.text($(this).text()).removeClass('active'); $this.val($(this).attr('rel')); $list.hide(); console.log($this.val()); }); $(document).click(function() { $styledSelect.removeClass('active'); $list.hide(); });});<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script><div class="dropdown"> <select id="office-select"> <option value="hide"><a>choose a number</a></option> <option value="1">1</option> <option value="2">2</option> </select> <button class="resetbtn" type="submit">X</button></div>這是一個正在運行的JSFiddle。假設我們選擇數字 6,然后屏幕底部會顯示一些內容。之后我想單擊按鈕來重置我的選擇菜單。因此文本choose a number應該再次顯示為占位符。這可能嗎?
HTML 將下拉選擇菜單重置為默認值
撒科打諢
2023-07-06 17:29:49