Question

我想为我的网站创建一个高级搜索框。我正在使用＆＃34;下拉框＆＃34;和＃34;文本框＆＃34;获得在网站上开始搜索的价值。

我想根据文本框值进行搜索，下拉值为＆＃34; image＆＃34;然后点击搜索按钮..

在下拉列表中有两个值

图像
视频

如果选择图像，则仅显示图像，否则仅显示视频。

ADSearchbox图片网址

谢谢。

＆＃13;

$('#findNow').on('click',function(){
    document.getElementById("content11").innerHTML ="";
    document.getElementById("content12").innerHTML ="";
    var a =$('#search1').val();
    var url = "https://www.googleapis.com/customsearch/v1?key=YOURAPIKEY&cx=005124428384360536924:rstfldysumw&q="+a+"&searchType=image&safe=high";
    var jqxhr = $.getJSON(url, function() {
        console.log("success");
    }).done(function(data) {
        for (var i = 0; i < 12; i++) {
             var item = data.items[i];
             document.getElementById("content11").innerHTML += "<div class='col-md-3 c'>" + "<div class='b'><a class='add_img'><img src=" + item.link + " height="200px" class='thumbnail' width="200px" /></a></div><div class='a mn-video-title'> " + item.title + "</div></div>";
             document.getElementById("content12").innerHTML += "<a href='#_' class='lightbox' ><img src=" + item.link + " /></a>";
            $('.lightbox').each(function(i){
                var a = 'img' + (i++);
                $(this).attr('id',a);
            });
            $('.add_img').each(function(i){
                var b = '#img' + (i++);
                $(this).attr('href', b);
            });
        }
    }).fail(function(data) {
        console.log("error");
    });
});

＆＃13;

<div class="log">
    <form role="form" method="post" enctype="multipart/form-data">
        <div class="form-group col-md-6 aa">
            <label class="co" for="usrname">Search</label>
            <input type="text" class="form-control" placeholder="Search Here.." name="search" id="search1">
        </div>
        <div class="form-group col-md-6 bb">
            <label class="co" for="psw">Select Category</label>
                <select name="category" id="sel" class="form-control">
                    <option value="image">Image</option>
                    <option value="vidio">Vidio</option>
                </select>
            </div>
            <div class="form-group">
                <div class="col-md-12">
                    <div class="bbt">
                        <button type="button" class="btn btn-blue btn-effect" name="sear">Search</button>
                    </div>
                </div>
            </div>
        </form>
    </div>

＆＃13;

如何搜索下拉列表中选择的数据

0 个答案: