Question

我有这个HTML：

<ul class="nav nav-tabs ilia-cat-nav" data-toggle="dropdown" data-bind="foreach : Items" style="margin-top:-30px">
    <li role="presentation" data-bind="attr : {'data-id' : ID , 'data-childCount' : Children().length}" style="padding-left: 20px; padding-right: 20px;  text-align: center; color: white" class="active-li">
        <label id="menu1" data-toggle="dropdown" data-bind="text: Name"></label>
        <ul class="dropdown-menu" data-bind="foreach: Children" role="menu" aria-labelledby="menu1">
            <li role="presentation"><a role="menuitem" data-bind="text: Name, attr: { 'href': Url} "></a></li>
        </ul>
    </li>
</ul>

使用knockoutjs创建我的菜单，它完美地工作，href标记上的a属性正确填充href="/site/models#{"catId": "76b4a8ed-1350-46af-8184-3b68029cbd22"}"但是当我点击该项目时，它并没有＆＃39 ; t重定向到新页面。我的第一个想法可能是因为哈希，但它不是，所以我试图使用target属性用于任何_self以及其他所有它不起作用。所以我的下一个猜测是，有一个javascript方法覆盖了这个，到目前为止我还没有找到任何东西。所以我的问题是为什么它不起作用？

KnockOut ViewModel：

landing.dataModels.Category = function (_id, _categoryTypeId, _name, _description, _parentId, _children) {

    var self = this;

    this.ID = ko.observable(_id);
    this.CategoryTypeId = ko.observable(_categoryTypeId);
    this.Name = ko.observable(_name);
    this.Description = ko.observable(_description);
    this.ParentId = ko.observable(_parentId);
    this.Url = ko.computed(function () {
        return '/site/models#{"catId": "' + self.ID() + '"}';
    });
    this.Children = ko.observableArray([]);
    this.getChildren = ko.computed(function () {
        return self.Children();
    });
    _.each(_children, function (item) {
        self.Children.push(new landing.dataModels.Category(item.ID, item.categoryTypeId, item.Name, item.Description, item.ParentId, item.Children));
    });
};

更新

我必须说当我右键单击该项目并在新窗口中打开它确实有效并显示该页面，但它不能直接左键单击。

Answer 1

问题可能在于生成的网址中的引号：

href="/site/models#{"catId": "76b4a8ed-1350-46af-8184-3b68029cbd22"}"

href的值实际为"/site/models#{"，其余的网址为无效HTML。

您可以尝试绑定到转义的网址：

this.Url = ko.computed(function () {
    return encodeURI('/site/models#{"catId": "' + self.ID() + '"}');
});

Answer 2

最后我累了，我只是点了一个简单的jquery点击它就可以了：

    $(document).ready(function () {
        setTimeout(function () {
            $(document).on("click", ".ilia-catLink", function () {
                var a = $(this).attr("href");

                window.location = a;
            });
        }, 100);

它以这种方式工作，但我仍然想知道为什么那个href不会起作用。

Knockoutjs正确绑定，但标签上的href不会重定向到页面

2 个答案: