文章/答案/技术大牛

发布

社区首页 >问答首页 >使用jquery单击“不工作”引导预键入建议链接

问使用jquery单击“不工作”引导预键入建议链接
EN

Stack Overflow用户

提问于 2015-10-09 09:14:16

回答 1查看 2.2K关注 0票数 1

我一直在努力使用从Bootstrap's typeahead下载的3-4个小时的https://github.com/twitter/typeahead.js/，我正在尝试添加一个点击函数，其中包含了typeahead的建议，即用javascript的window.location.href更改页面。我的类型在json值中运行良好。

// Typeahead
$("#search-product").typeahead({
    ajax: {
        url: "_inc/search-json.php?product=",
        timeout: 500,
        displayField: "product_name",
        triggerLength: 3,
        method: "get",
        preDispatch: function (query) {
            return {
                search: query
            }
        },
    }
});

在建议中，ul建议包含两个值:1)产品名称，2)产品Id。样本html结构；

<ul class="typeahead dropdown-menu">
    <li data-value="166" class=""><a href="#"><strong>TK03</strong>0</a></li>
    <li data-value="167"><a href="#"><strong>TK03</strong>1</a></li>
</ul>

并尝试在li的重定向用户中添加点击功能，用jquery代码将用户重定向到产品细节页面；

var productId = $('.typeahead li').data("value");
$(".typeahead").on( "click", "li", function() {
    window.location.href = "/product-details.php?i=" + productId;
});

但是它总是重定向到：product-details.php?i=undefined，我的代码有什么问题，我遗漏了什么？

jquery

typeahead.js

javascript

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-10-09 09:20:51

var productId = $('.typeahead li').data("value"); // Doesnt make any sense outside the click callback. Instead write it within the callback like shown below.

您需要在click回调中像这样获取产品Id：

$(".typeahead").on( "click", "li", function() {
   var productId = $(this).data("value");  // $(this) refers to the clicked li
   window.location.href = "/product-details.php?i=" + productId;
});

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/33034373

复制

相似问题

问使用jquery单击“不工作”引导预键入建议链接
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用jquery单击“不工作”引导预键入建议链接EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用jquery单击“不工作”引导预键入建议链接
EN