Question

我正在尝试将html放在bootstrap popover中并且内容很好地显示但是当我点击popover中的链接时，它只会转到触发弹出框的锚标记上的父'OpenRecent'方法。你可以在数据内容html中看到我尝试调用我想要的函数的不同方式。我怎样才能做到这一点？

<ul id="RecentSearches" class="nav nav-tabs nav-stacked well" data-bind="foreach: CurrentItems">
        <li>
            <div>
                <input type="checkbox" class="checkbox inline" data-bind="value: $data.TransId,
                                                                          checked: $root.ItemsSelected"/>
                <a href="#"
                   data-bind="text: $data.Description + '-' + $data.County,
                              attr: 
                              { 
                                id: $data.TransId,
                                'data-title': $data.Description
                              },
                              click: $root.OpenRecent"
                   data-trigger="hover"
                   rel="popover"
                   data-html="true"
                   data-content="<a data-bind='click: $parent.Print.bind($data)'>Print</a> |
                                 <a data-bind='click: app.RecentSearches.Print.bind($data)'>Print 2</a>
                                 <a data-bind='click: $parent.Email'>Email</a> |
                                 <a data-bind='click: $parent.SaveToPDF'>PDF</a> |
                                 <a data-bind='click: $parent.SavetToCSV'>CSV</a>">
                </a>
            </div>
        </li>
    </ul>

Answer 1

HTML是你的data-content不会被Knockout绑定，因为它是后来动态添加的。

一种选择是添加一种识别链接（类）的方法，然后使用unobstrusive approach添加事件处理程序。

$("ul").on("click", ".print", function(event) {
     var context = ko.contextFor(this);
     context.$root.Print(context.$data);
     event.preventDefault();
});

我不确定为什么要调用OpenRecent函数。在我看来，引导程序会在触发它的元素之外创建弹出窗口。所以，这不会是popover的父母。如果您仍然遇到该部分的问题，那么也许您可以在jsFiddle中使用它。

这是一个不显眼的处理程序的小提琴：http://jsfiddle.net/rniemeyer/Edww3/

无法获得链接以正确使用popover中的bootstrap html数据内容

1 个答案: