如何将重复搜索框添加到jquery自动完成

在This博客我已成功创建jquery自动完成与搜索按钮成功。但我想，就像This 如何将重复搜索框添加到jquery自动完成

我的搜索框的目标选择tags->重定向到另一个页面..

我的问题是我想多加一个搜索框，只需按动一个按钮只有我的意思是搜索领域的我的意思是搜索区域应2相同的链接，我的意思是我修改像邮政编码链接和城市链接的链接后，但我目前需要使用多个搜索领域，我希望我的问题是明确的，上面一个搜索按钮是我的代码

var selectedItemUrl = ""; 
 
    $(function() { 
 
    var source = [{ 
 
     value: "NYC", 
 
     url: 'http://www.nyc.com' 
 
    }, { 
 
     value: "LA", 
 
     url: 'http://www.la.com' 
 
    }, { 
 
     value: "Philly", 
 
     url: 'http://www.philly.com' 
 
    }, { 
 
     value: "Chitown", 
 
     url: 'http://www.chitown.com' 
 
    }, { 
 
     value: "DC", 
 
     url: 'http://www.washingtondc.com' 
 
    }, { 
 
     value: "SF", 
 
     url: 'http://www.sanfran.com' 
 
    }, { 
 
     value: "Peru", 
 
     url: 'http://www.peru.com' 
 
    }]; 
 

 
    $("#autocomplete").autocomplete({ 
 
     minLength: 0, 
 
     source: source, 
 
     select: function(event, ui) { 
 
     selectedItemUrl = ui.item.url 
 
     } 
 
    }) 
 

 
    }); 
 

 
    function SearchItem(e) { 
 
    if (selectedItemUrl != "") 
 
     window.location = selectedItemUrl 
 
    else 
 
     alert("select something to search") 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"> 
 
</script> 
 

 
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" /> 
 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 
 
<input id="autocomplete" /> 
 
<button onclick='SearchItem()'>search

来源

2016-06-28 Stackz

不清楚究竟ü要实现 –

这样http://www.indeed.co.in/我需要什么我的意思是只有一个按钮与不同的搜索字段我已经添加了一个搜索字段与一个按钮，但无法添加另一个搜索字段的链接，因为我上面解释 – Stackz

你不应该打开从J的多个链接S，它很容易被最终用户浏览器阻止。 – Yuri

试试这个

整个代码

<!DOCTYPE html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"> 
</script> 

    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 

<script> 
var selectedItemUrl1=null 
    var selectedItemUrl2=null 

    $(function() { 
    var source = [{ 
     value: "NYC", 
     url: 'http://www.nyc.com' 
    }, { 
     value: "LA", 
     url: 'http://www.la.com' 
    }, { 
     value: "Philly", 
     url: 'http://www.philly.com' 
    }, { 
     value: "Chitown", 
     url: 'http://www.chitown.com' 
    }, { 
     value: "DC", 
     url: 'http://www.washingtondc.com' 
    }, { 
     value: "SF", 
     url: 'http://www.sanfran.com' 
    }, { 
     value: "Peru", 
     url: 'http://www.peru.com' 
    }]; 

    var source2 = [ { 
     value: "LA", 
     url: 'http://www.la.com' 
    }]; 

    $("#autocomplete").autocomplete({ 
     minLength: 0, 
     source: source, 
     select: function (event, ui) { 
      selectedItemUrl1 = ui.item.url 
     } 
    }) 

    $("#autocomplete2").autocomplete({ 
     minLength: 0, 
     source: source2, 
     select: function (event, ui) { 
      selectedItemUrl2 = ui.item.url 
     } 
    }) 

}); 

function SearchItem(e) { 
    if (selectedItemUrl1.indexOf("http") != -1 && selectedItemUrl2.indexOf("http") != -1) { 
     if (selectedItemUrl1 != "" && selectedItemUrl2 != "") { 
      $("#output").append("<div ><object style='heigth:600px;width:600px;float:left' data='" + selectedItemUrl1 + "'/></div>"); 
      $("#output").append("<div ><object style='heigth:600px;width:600px;float:left' data='" + selectedItemUrl2 + "'/></div>"); 


     } 
    } 

}

</head> 
<body> 
    <input id="autocomplete" /> 
    <input id="autocomplete2" /> 
    <button onclick='SearchItem()'>search</button> 
<div id="output"></div> 
</body> 
</html>

来源

2016-06-28 06:29:15 patilprashant6792

已添加，但无法获取http://jquerytest2.blogspot.in/ @ patilprashant6792 – Stackz

更新了代码尝试 – patilprashant6792

当我点击搜索框后没有任何响应从搜索框中选择刚刚查看http://jquerytest2.blogspot.in/ @ patilprashant6792 – Stackz

如何将重复搜索框添加到jquery自动完成

回答

相关问题