首頁 >web前端 >js教程 >用jQuery模擬select下拉框的簡單範例程式碼_jquery

用jQuery模擬select下拉框的簡單範例程式碼_jquery

WBOY
WBOY原創
2016-05-16 17:02:221215瀏覽

很多時候,美工會覺得預設的select下拉框很難看(特別是右邊的下拉箭頭按鈕),他們通常喜歡用一個自訂的圖示來取代這個按鈕。這樣就只能用js div 來模擬了,倒騰了一番,用jQuery模擬了下,當然網上這種文章也不少,只是懶得去看找

複製程式碼 程式碼如下:




   
    自己实现的下拉框
   
   
   
< /head>


href="#" onclick="showExpand('txt_city','city_select1','expand')">▼


< input type="text" value="" id="txt_city2" class="input_expand" /> href="#" onclick="showExpand('txt_city2','city_select2','expand' )">▼













無图無真実、真実在此处:

不足之处:
1、按键盘上下键時、高輝度の自動移動
2がありません、文字入力自動濾過結果時、相対的に原生的な選択を感じますいくつかの不自然
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn