我在将搜索结果重定向到我想要显示结果的页面时遇到问题。想要在标题中添加搜索栏,以便我的结果显示在结果页面或类似的内容上。一切都是通过教程(Laracasts)完成的,仍在学习 javascript,所以我有点卡在这里..一些帮助会很棒!
index.blade.php
<script src="http://code.jquery.com/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.11.1/typeahead.bundle.min.js"></script>
<script src="http://cdn.jsdelivr.net/algoliasearch/3/algoliasearch.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/0.12.1/vue.js"></script>
<script>
new Vue({
el: 'body',
data: {
query: '',
users: []
},
ready: function () {
this.client = algoliasearch('', '');
this.index = this.client.initIndex('test_drive_contacts');
$('#typeahead').typeahead(null, {
source: this.index.ttAdapter(),
displayKey: 'firstname',
templates: {
suggestion: function (hit) {
return '<div>' +
'<h4 class="high">' + hit._highlightResult.firstname.value + '</h4>' +
'<h5 class="high">' + hit._highlightResult.company.value + '</h5>'
+ '</div>';
}
}
})
.on('typeahead:select', function (e, suggestion) {
this.query = suggestion.firstname;
}.bind(this));
},
methods: {
search: function () {
this.index.search(this.query, function (error, results) {
this.users = results.hits;
}.bind(this));
}
}
});
</script>
这是搜索输入:
<input id="typeahead" type="text" class="form-control" v-model="query"
v-on="keyup: search | key 'enter'">
<article v-repeat="user: users">
<h2>@{{ user.firstname }}</h2>
<h4>@{{ user.company }}</h4
</article>
最佳答案
将用户重定向到 JavaScript 页面就像做事一样简单
window.location = 'your_url_here'
如果您只是想在用户键入 Enter 时重定向到 /search?q=query
页面,那么就像包装您要输入的内容一样简单在表单内部使用。
<form action="/search" method="GET">
<input type="search" id="your-input" name="q" />
</form>
如果您想重定向到项目页面,typeahead:select
事件将为您提供所选选项:
$('#your-input')
.typeahead(/* ... */)
.on('typeahead:select', function (e, suggestion) {
window.location = suggestion.url;
});
关于javascript - Algolia 重定向到搜索结果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35173026/