带knockout.js的Bootstrap popover

作者

我有一个应用程序通过AJAX调用接收一些数据。然后，使用knockout.js库将接收到的数据绑定到DOM元素。我想使用boostrap的低调标记来创建这样的弹出窗口：

&lt；table class=“table-table-condensed”数据绑定=“foreach:items”&gt；
&lt；tr&gt；
&lt；td&gt&书信电报；b data bind=“text:$data.id”&gt&lt/b&gt&lt/td&gt；
&lt；td data bind=“text:$data.title”&gt&lt/td&gt；
&lt；td&gt&书信电报；a href=“”rel=“popover”data bind=“attr:{title:$data.info}”data placement=“top”&gt；信息&lt/a&gt&lt/td&gt；
&lt/tr&gt；
&lt/表&gt；

根据最新的bootstrap文档，不需要像$（'.popover'）.popover（）这样的隐式调用，但是，它不起作用

我想，boostrap.js对document.ready执行一些DOM分析，并执行popover工作所需的所有工作。问题是：在收到AJAX响应后，是否有办法告诉bootstrap.js对数据执行类似的工作？或者如何达到这种要求

您可以创建自定义数据绑定，以使该元素成为popover。检查这个JSFIDLE演示

ko.bindingHandlers.bootstrapPopover={
init：函数（元素、valueAccessor、allBindingsAccessor、viewModel）{
var options=ko.utils.unwrapobbservable（valueAccessor（））；
var defaultOptions={}；
options=$.extend（true，{}，defaultOptions，options）；
$（元素）.popover（选项）；
}
};
var viewModel={
项目：ko.Array([{
“id”：1，
“标题”：“标题-1”，
“info”：“info-1”}，
{
“id”：2，
“标题”：“标题2”，
“info”：“info-2”}，
{
“id”：3，
“标题”：“标题-3”，
“信息”：“信息-3”}]）
}
应用绑定（视图模型）；​

和html

&lt；div class=“container”&gt；
&lt；div class=“英雄单位”&gt；
&lt；table class=“table-table-condensed”数据绑定=“foreach:items”&gt；
&lt；tr&gt；
&lt；td&gt&书信电报；b data bind=“text:$data.id”&gt&lt/b&gt&lt/td&gt；
&lt；td data bind=“text:$data.title”&gt&lt/td&gt；
&lt；td&gt&书信电报；a href=”“data bind=“bootstrappover:{content:$data.info}”&gt；信息&lt/a&gt&lt/td&gt；
&lt/tr&gt；
&lt/表&gt；
&lt/部门&gt；
&lt/部门&gt；​

相关文章：

  1. 如何从Firefox或Chrome浏览器手动发送HTTP POST请求
  2. 在MVC中，如何返回字符串结果？
  3. 在大多数web浏览器中是否有PUT、DELETE、HEAD等方法？
  4. 如何将数据发布为表单数据而不是请求负载？

发表评论

© 2024 开发百科-程序代码问答平台 • Built with