html自定義搜尋框(與selector2不同)

2021-08-07 02:14:01 字數 3006 閱讀 3497

1.新建test.html

引入jquery-2.1.1.js、bihzpy.js、test.css、test.js檔案

charset="utf-8">

智慧型搜尋title>

src="./js/jquery-2.1.1.js">

script>

src="./js/bihzpy.js">

script>

href="./css/test.css"

rel="stylesheet" />

src="./js/test.js">

script>

head>

class="chart-search">

class="search-city-name"

type="text"

placeholder="搜尋" />

class="search-city-content">

class="search-ul-list">

cityname="廣東省+深圳">

class="city"

type="checkbox">

class="city-span"

style="">廣東省+深圳span>

li>

cityname="廣東省+潮州">

class="city"

type="checkbox">

class="city-span">廣東省+潮州span>

li>

cityname="廣東省+福建">

class="city"

type="checkbox">

class="city-span">廣東省+福建span>

li>

cityname="廣東省+廣州">

class="city"

type="checkbox">

class="city-span">廣東省+廣州span>

li>

cityname="廣東省+廈門">

class="city"

type="checkbox">

class="city-span">廣東省+廈門span>

li>

cityname="廣東省+汕頭">

class="city"

type="checkbox">

class="city-span">廣東省+汕頭span>

li>

cityname="廣東省+東莞">

class="city"

type="checkbox">

class="city-span">廣東省+東莞span>

li>

cityname="廣東省+杭州">

class="city"

type="checkbox">

class="city-span">廣東省+杭州span>

li>

cityname="廣東省+成都">

class="city"

type="checkbox">

class="city-span">廣東省+成都span>

li>

cityname="廣東省+重慶">

class="city"

type="checkbox">

class="city-span">廣東省+重慶span>

li>

cityname="廣東省+葉門">

class="city"

type="checkbox">

class="city-span">廣東省+葉門span>

li>

cityname="廣東省+寧遠">

class="city"

type="checkbox">

class="city-span">廣東省+寧遠span>

li>

cityname="廣東省+寧靜">

class="city"

type="checkbox">

class="city-span">廣東省+寧靜span>

li>

cityname="廣東省+寧夏">

class="city"

type="checkbox">

class="city-span">廣東省+寧夏span>

li>

cityname="廣東省+撫遠">

class="city"

type="checkbox">

class="city-span">廣東省+撫遠span>

li>

cityname="廣東省+廣西">

class="city"

type="checkbox">

class="city-span">廣東省+廣西span>

li>

ul>

div>

div>

script>

body>

html>

2.新建test.css

.chart-search

.search-city-name

.search-city-content

.search-ul-list

.city

.city-span

3.新建test.js

$(document).ready(function

() else

}});

//拼音和漢字搜尋

function

searchcity

() else else

});}

}$('.search-city-name').bind('input propertychange', function

() );

})

自定義搜尋框

自定義搜尋框 1 自定義自定義的文字框必須在 void layoutsubviews中才能自定義 即子控制項必須在layoursubviews中設定,而searchbar可以直接設定 placeholder,外背景 2 storyboard隨意設定即可 3 純 字型顏色和大小無法設定,但是外邊框可以...

Qt 自定義搜尋框

1.建立輸入框 qlineedit text new qlineedit this text setgeometry 50,80,200,25 text setobjectname qstring text 2.建立按鈕 qsize size qsize 40,text height qpushbu...

qt 之自定義 搜尋框

當然,這些對於qt實現來說毫無壓力,只要思路清晰,分分鐘搞定。列舉 qlineedit actionposition常量值 描述qlineedit leadingposition 0當使用布局方向qt lefttoright時,部件顯示在文字左側,使用qt righttoleft則顯示在右側。qli...