如何修改此JQuery函數

-3

我正在使用jquery.autocomplete來顯示搜索建議。現在該函數將該值取入並將其插入「/ collections /」之後。如何修改此JQuery函數

我喜歡給每個標籤一個自定義url。如果任何人都可以告訴我如何執行這將是很棒的。

$(function(){ 
 
    var tags = [  
 
    { value: 'product1' }, 
 
    { value: 'product2' }, 
 
    { value: 'product3' }, 
 
    { value: 'product4' } 
 
    ]; 
 
    
 
    $('#autocomplete1').autocomplete({ 
 
    lookup: tags, 
 
    lookupFilter: function (suggestion, originalQuery, queryLowerCase) { 
 
    return suggestion.value.toLowerCase().indexOf(queryLowerCase) === 0; 
 
    }, 
 
    onSelect: function (suggestion) { 
 
    document.location.href = "/collections/" + $(this).val() 
 
    } 
 
    }); 
 

 

 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.devbridge-autocomplete/1.2.24/jquery.autocomplete.js"></script> 
 

 
<form method="get" id="searchbar" action="/search"> 
 
    <button type="submit" value="Search"> 
 
    <span class="icon-search"></span> 
 
    </button> 
 
    <input type="text" name="q" autocomplete="off" id="autocomplete1" placeholder="Search"/> 
 
</form>

因此，像這樣：

$(function(){ 
    var tags = [  
    { value: 'product1', url: '/collections/product1' }, 
    { value: 'product2', url: '/collections/product2b' }, 
    { value: 'product3', url: '/collections/product3a' }, 
    { value: 'product4', url: '/collections/product4b' }, 
    ];

來源

2016-03-06 Alexander Hein

你可以請出示HTML去沿着這 – user2950720

爲此，您可以使用ui.item.{parameter}，所以你的情況，在這種情況下ui.item.url

當你點擊來自自動完成的值ui.item設置爲：

[object Object] { 
    label: "product1", 
    url: "/collections/product1", 
    value: "product1" 
}

然後你就可以輕鬆地選擇URL和指向文檔位置

$(function() { 
 
    var availableTags = [ 
 
    { 
 
     url: '/collections/product1', 
 
     value: 'product1' 
 
    }, 
 
    { 
 
     url: '/collections/product2b', 
 
     value: 'product2' 
 
    }, 
 
    { 
 
     url: '/collections/product3a', 
 
     value: 'product3' 
 
    }, 
 
    { 
 
     url: '/collections/product4b', 
 
     value: 'product4' 
 
    } 
 
    ]; 
 
    
 
    $("#autocomplete1").autocomplete({ 
 
     source: availableTags, 
 
     select: function (event, ui) {     
 
     document.location.href = ui.item.url;  
 
     } 
 

 
    }); 
 
    });

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<link href="https://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" /> 
 
<script src="https://code.jquery.com/jquery-1.11.3.js"></script> 
 
<script src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 

 
<div class="ui-widget"> 
 
    <label for="tags">Tags: </label> 
 
    <input type="text" name="q" autocomplete="off" id="autocomplete1" placeholder="Search"/> 
 
</div> 
 
    
 
</body> 
 
</html>

來源

2016-03-06 12:00:35 user2950720

你有一個可行的解決方案與純jquery.autocomplete？ –

將選擇功能更改爲：onSelect：function（建議）{document.location.href = suggestion.url; }將源更改爲查找 – user2950720

如何修改此JQuery函數

回答

相關問題