为动态加载的 HTML 内容触发 Bootstrap JS 行为

2024-05-23

我正在动态加载包含 Bootstrap 标记的 HTML 模板。但是,Bootstrap Javascript 行为不会应用于加载的内容。例如,如果加载的内容包含 Bootstrap 模式的标记,则该模式将无法正确运行。

有没有办法可以触发 Bootstraprefresh or apply这是新加载内容的Javascript吗?


您需要在加载动态内容的任何函数/请求对象的回调中初始化模式

没有看到你的代码很难说,但是像这样

require(['!text/myDynamicTemplate.html'], function(template){
   //logic to render the template and/or insert it into the dom here

   $('#myModal').modal(options)
})

Edit:

Bootstrap 单独定义了它的 javascript 插件。没有全局引导对象

这是工具提示的插件定义

  function Plugin(option) {
    return this.each(function () {
      var $this   = $(this)
      var data    = $this.data('bs.tooltip')
      var options = typeof option == 'object' && option

      if (!data && /destroy|hide/.test(option)) return
      if (!data) $this.data('bs.tooltip', (data = new Tooltip(this, options)))
      if (typeof option == 'string') data[option]()
    })
  }

  var old = $.fn.tooltip

  $.fn.tooltip             = Plugin
  $.fn.tooltip.Constructor = Tooltip


  // TOOLTIP NO CONFLICT
  // ===================

  $.fn.tooltip.noConflict = function () {
    $.fn.tooltip = old
    return this
  }

}(jQuery);

因此,您可以通过 $('#myID').tooltip 访问的唯一内容是构造函数和初始化程序

在不修改引导程序代码的情况下可以做到的最好的事情

$('[data-toggle=tooltip]').tooltip()

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

为动态加载的 HTML 内容触发 Bootstrap JS 行为 的相关文章

  • jQuery 验证日期范围问题

    我的代码中有很多地方有成对的相关开始和结束日期字段 范围 我需要验证开始日期早于结束日期 我正在使用 jQuery 验证插件 这是我的代码 http jsfiddle net jinglesthula dESz2 http jsfiddle
  • VS 2010 Web应用程序中的ASP.NET Web Api CRUD操作

    我尝试在 VS 2010 Web 应用程序中进行 ASP NET Web Api CRUD 操作 但为什么结果没有从源表返回所有整行 这是我的代码 路线 Globax asax protected void Application Star
  • 在 JavaScript 中定位提示弹出窗口

    我有一个如下所示的 JavaScript 提示 我想将提示放在屏幕中心 如何使用 javascript 做到这一点 function showUpdate var x var name prompt Please enter your na
  • 单击输入字段会触发窗口调整大小

    我有一个带有徽标 菜单和搜索的标题 当我在桌面上时 我会按该顺序显示所有元素 但如果我的窗口宽度小于 980 像素 菜单会隐藏 有一个切换按钮 并且徽标会与nav并附在徽标之后 如果宽度更大 则徽标将再次分离并附加到 DOM 中的旧位置 w
  • canvas.getContext('2D') 返回空值

    我创建了一个画布并将其命名为getContext 方法 但它返回null为上下文 这是我使用的代码 我在控制台中得到了这个
  • 离子旋转器未显示

    我用 http 请求填充 Ionic 集合重复列表 但我不想将所有内容直接加载到 DOM 中 因此 我只显示其中一些项目 并在您向下滚动时添加其余项目 为此我实现了无限滚动功能 当我到达页面底部时 它应该显示一个旋转器 但它没有 这些物品至
  • 如何将函数传递给 JavaScript Web Worker

    我想通过一个 或多个 函数传递postMessage 给网络工作者 因为我无法引用常规文件 为了启动 Web Worker 我将一个对象 URL 从 Blob 创建 传递给Worker构造函数 然后我传递一条消息 但到目前为止还没有在消息中
  • 从网站存储数据的最简单方法(在服务器端)

    我有一个非常简单的网站 实际上是单页 有一个输入字段和一个按钮 我需要将用户提交的数据存储在服务器端的某个位置 完美的方法可能是简单的文本文件 并在每次单击按钮后附加新行 日志文件也可以 据我了解 JavaScript 本身是不可能的 我在
  • 更改时触发跨度文本/html

    jQuery 或 JavaScript 中是否有任何事件在以下情况下触发span标签 text html 已更改 Code span class user location span user location change functio
  • JavaScript:预期的赋值或函数调用,却看到了一个表达式

    我正在使用 JSHint 来确保我的 JavaScript 是 严格的 但我收到以下错误 预期是赋值或函数调用 但看到的是表达式 关于以下代码 var str A B C D var data var strArr str split fo
  • 浏览器默认区域设置 - Intl.DateTimeFormat 与 navigator.language

    在对网站进行编码并格式化日期时 我想使用用户在浏览器中设置的区域设置 例如 如果用户定制了他们的chrome settings languages在 Chrome 中设置为非默认值 这就是我想要使用的值 但是 当我在此类浏览器的控制台中运行
  • Phonegap facebook 插件:android 的各种问题

    我正在尝试将 Phonegap 3 1 与 Phonegap facebook plugin 集成 以使我的应用程序能够使用 facebook 登录 https github com phonegap phonegap facebook p
  • (0, eval) () 的作用是什么? [复制]

    这个问题在这里已经有答案了 以下内容来自这个问题 https stackoverflow com questions 14119988 return this 0 evalthis 14120023 14120023 function q
  • ReferenceError 和全局对象

    在浏览器中的 JavaScript 中window是全局对象 这意味着在全局范围内定义的每个变量都是window 那么为什么我会得到这个结果 console log window foo No error logs undefined co
  • 如何在 Bootstrap 列中使用文本溢出?

    假设我有一行具有固定高度 并且我在其列中插入了一些文本 如果太长 我希望将其剪掉 并在行尾添加三个点 如下所示 我在用着文本溢出 省略号 我的行中有此属性 但无法使其工作 JsFiddle http jsfiddle net Alexnot
  • 如何生成 JavaScript 堆栈跟踪? [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 关于如何以跨浏览器的方式在 javascript 中生成堆栈跟踪有什么建议吗 较新的浏览器 Chrome 和 Firefox 公开了一个允
  • `ie9` - contenteditable false 在父级可编辑时不起作用

    我正在尝试制作内容可编辑和不可编辑的容器 用户可以通过 3 种方式使用它 他们可以将内容与non editable 他们可以将内容与editable 他们可以在不选择其中之一的情况下放置内容 可编辑 我正在努力实现以下目标 content
  • Javascript:更改输入值时设置光标位置

    当您输入公式时 我试图在我的应用程序中重现类似于 Microsoft Excel Google Sheets 的用户体验 并且您可以使用不同的公式和变量来自动完成下拉菜单 为此 在验证自动完成功能后 我希望能够控制光标的位置 例如 如果我输
  • JavaScript 中最长的通用前缀

    我正在尝试解决 Leet Code 挑战14 最长公共前缀 https leetcode com problems longest common prefix 编写一个函数来查找字符串数组中最长的公共前缀字符串 如果没有公共前缀 则返回空字
  • 向特定客户端发送消息以及消息发送用户

    我是 SignalR 的初学者 我创建了一个基于 SignalR 的基本聊天应用程序 我面临的问题是我想向特定客户端以及发送消息的用户发送消息 这个怎么做 我知道要向特定客户端发送消息 我们可以这样做 Clients Client Cont

随机推荐

  • 使用 django-rest-framework 设置对象级权限

    尝试使用 django rest framework 最干净 最规范地管理 django guardian 对象级权限 我想将对象的读取权限 module view object 分配给在执行 POST 时发出请求的用户 我的基于阶级的观点
  • 由于 MIME 类型而导致资源被阻止?

    多年来我已经成功地包含动态创建的 javascript 文件 这是一个例子 https granadainfo com sups php locs 95 https granadainfo com sups php locs 95 正如你所
  • WebApi 自定义 JsonConverter 未调用

    我为 Guid 实现了一个自定义 JsonConverter 如果我在像这样序列化的类的属性 Guid 类型 上声明它 JsonConverter typeof JsonGuidConverter 然后它被调用并且工作正常 但是 我想 自动
  • 将非常大的Python列表输出保存到mysql表中

    我想将 python 生成的列表的输出保存在 mysql 数据库的表中 该表如下所示 mysql 中的 myapc8 表 https i stack imgur com 4B4Hz png这是Python代码 在此输入图像描述 https
  • OpenShift Git 克隆错误

    我是 OpenShift 的新手 我有一个问题 当我做 rhc app git clone mynewapp Your public ssh key must be uploaded to the OpenShift server Woul
  • 如何在 iPad 应用程序上禁用横向方向?

    我创建了一个全新的单视图 iOS 通用 Swift 应用程序 然后 我在应用程序设置中取消选中 横向左 和 横向右 我在 iPhone 上运行了它 万岁 无论我如何旋转手机 它都会保持纵向模式 然后我在 iPad 上运行它 它会旋转到任何内
  • 在 SQL Management Studio 2012 中调试

    我正在使用 Management Studio 2012 但无法调试任何 SQL 代码 在我点击 调试 按钮后 左侧没有看到任何绿色箭头 并且我的 SQL 对象都没有加载到内存中 当我将光标移到我设置的断点上时 我收到此消息 The bre
  • 是否可以在回发时禁用 f:event type="preRenderView" 侦听器?

    进行回发时是否可以 禁用 触发此操作
  • INTEGER 到 DATETIME 的转换与 VB6 不同

    我正在查看一些遗留的 VB6 代码 比我的时代早很多年 它对 SQL 2005 数据库运行查询 它提供了日期限制WHERE子句 其中日期作为整数值给出CLng VB6 中的日期 e g WHERE SomeDateField gt 4006
  • 仅使用 git 存储未暂存的更改(不是 --keep-index)

    首先 我确实知道 keep index 这不是我想要的 因为它仍然隐藏着all更改 但将暂存的更改保留在工作树中 如果可能的话 我只想存储未暂存的文件 而无需再次添加所有更改git stash patch 如果您想存储索引 已暂存的内容 和
  • Mercurial 撤消最后一次提交

    如何撤消 Mercurial 中上次意外提交 未推送 的更改 如果可能的话 最好使用 TortoiseHg 来实现这一点 Update 在我的具体案例中 我提交了一个变更集 未推送 然后我从服务器上拉取并更新 通过这些新的更新 我决定我的上
  • React Native Expo StackNavigator 重叠通知栏

    我正在尝试为我的 React Native Expo 应用程序实现导航栏 这里有一个问题 dependencies expo 18 0 3 react 16 0 0 alpha 12 react native 0 45 1 react na
  • 在python中将数据库表写入文件的最快方法

    我正在尝试从数据库中提取大量数据并将其写入 csv 文件 我正在尝试找出最快的方法来做到这一点 我发现在 fetchall 的结果上运行 writerows 比下面的代码慢 40 with open filename a as f writ
  • 如何停止 Visual Studio 2022 向 dc.services.visualstudio.com 发送请求

    我今天安装了 vs 2022 当运行我的项目时 我突然发现所有这些请求都在我的 Web 前端中触发 https dc services visualstudio com v2 track 有谁知道为什么升级到 2022 后会突然开始发生这种
  • 多处理中的动态池大小?

    有没有办法动态调整multiprocessing Pool尺寸 我正在编写一个简单的服务器进程 它会产生工作人员来处理新任务 使用multiprocessing Process对于这种情况可能更适合 因为工作人员的数量不应该是固定的 但我需
  • 是否有一种直接的方法可以使用 iTextSharp 将一个 PDF 文档附加到另一个 PDF 文档?

    我在网上搜索了有关如何执行此操作的示例 我发现有些人似乎比他们需要的更多地参与其中 所以我的问题是 使用 iTextSharp 是否有一种相当简洁的方法将一个 PDF 文档附加到另一个 PDF 文档 最好这不会涉及第三个文件 只需打开第一个
  • Twitter Bootstrap - 下拉菜单 - 箭头键不适用于 Firefox 中的输入标签

    要求 我想在带有用户名和密码字段的下拉菜单中放置一个登录表单 我可以做到这一点 除了以下问题之外 一切正常 Issue 打字时我无法使用箭头键 上 下 firefox 当输入位于下拉代码之外时 这很有效 这适用于其他浏览器 例如 googl
  • 您建议使用哪种压缩(GZIP 是最流行的)servlet 过滤器?

    我正在寻找一个用于大容量网络应用程序的 GZIP servlet 过滤器 我不想使用容器特定的选项 要求 能够压缩响应负载 XML Faster 已在大批量应用的生产中得到验证 应适当设置适当内容编码 跨容器移植 可选择解压缩请求 谢谢 我
  • Parsec.Expr 具有不同优先级的重复前缀

    Parsec Expr buildExpressionParser 的文档说 相同优先级的前缀和后缀运算符只能出现一次 即 如果 为前缀否定 则不允许使用 2 但是 我想解析这样的字符串 具体来说 考虑以下语法 sentence ident
  • 为动态加载的 HTML 内容触发 Bootstrap JS 行为

    我正在动态加载包含 Bootstrap 标记的 HTML 模板 但是 Bootstrap Javascript 行为不会应用于加载的内容 例如 如果加载的内容包含 Bootstrap 模式的标记 则该模式将无法正确运行 有没有办法可以触发