在建站課程里我們介紹了怎么制作網(wǎng)站搜索功能,這一節(jié)介紹一下功能更全的搜索功能,就是在搜索框前面放下拉選擇功能,這樣可以實現(xiàn)更精準的搜索。
效果圖:

方法如下:
首先,我們需要先制作前面的下拉選擇功能,要使用select標簽,里面的option的value里放分類的ID;

<select name="cat" class="cid">
<option value="1">找圖片</option>
<option value="2">查熱點</option>
<option value="3">查資訊</option>
</select>

然后,再制作后面的搜索框和按鈕,這個使用input標簽;

<input type="text" name="s" class="text lt" placeholder="請輸入你要搜索的關(guān)鍵字" value="">
<input type="submit" class="btn rt" value="搜索">

最后將上面二段代碼使用form標簽進行包裹,就形成帶有下拉選擇的搜索框功能了。

<form method="get" action="<?php bloginfo('url'); ?>/" id="top-search">
<select name="cat" class="cid">
<option value="<?php echo $catid01;?>">找工長</option>
<option value="<?php echo $catid02;?>">查工地</option>
<option value="<?php echo $catid04[0];?>">查資訊</option>
</select>
<input type="text" name="s" class="text lt" placeholder="請輸入你要搜索的關(guān)鍵字" value="">
<input type="submit" class="btn rt" value="搜索">
</form>