Fatal编程技术网
  • jquery/
  • Jquery Twitter引导工具提示不是'；行不通

Jquery Twitter引导工具提示不是'；行不通

jquery html twitter-bootstrap

Jquery Twitter引导工具提示不是'；行不通,jquery,html,twitter-bootstrap,Jquery,Html,Twitter Bootstrap,我有这个HTML： <li><a href="<?php echo $home; ?>" title="Go Home" data-placement="bottom" rel="tooltip"><?php echo $text_home; ?></a></li> 但是没有显示工具提示。我包括jquery（最新的2.0.0）和完整的TB（2.3.1），问题在哪里？（请看第二次编辑，可能有问题） 编辑我还包括以下CSS文件

我有这个HTML：

<li><a href="<?php echo $home; ?>" title="Go Home" data-placement="bottom" rel="tooltip"><?php echo $text_home; ?></a></li>
但是没有显示工具提示。我包括jquery（最新的2.0.0）和完整的TB（2.3.1），问题在哪里？（请看第二次编辑，可能有问题）

编辑我还包括以下CSS文件：

<link href="/catalog/view/theme/viaenvia/stylesheet/bootstrap.min.css" rel="stylesheet">
<link href="/catalog/view/theme/viaenvia/stylesheet/font-awesome.css" rel="stylesheet">
<link href="/catalog/view/theme/viaenvia/stylesheet/bootstrap-responsive.min.css" rel="stylesheet">
所以我认为CSS不是问题所在

EDIT2我正在使用jqueryui最新版本（1.10.2），jqueryui中的JS和CSS正在覆盖Twitter引导。这是我包含CSS的行（为了性能，在底部包含JS）
如何避免这种情况？

您的示例代码正在运行（请参见此），因此可能缺少javascript引用

要使用工具提示，您需要在对jquery的引用之后包含
bootstrap.js
（与所有插件一起）或至少包含
bootstrap tooltip.js
（请参阅上的选项）

（在下面的用户评论之后）

我建议现在检查两件事：

  • 在
    Net
    选项卡上，尝试查找对
    bootstrap.min.js
    文件的请求，并查看它是否成功完成
  • 在
    控制台
    选项卡上，运行选择器
    $（'a[rel=“tooltip”]，…
    ，查看它是否找到标记；如果找到，您应该能够调用类似
    $（'#元素'）。tooltip（'show'）
    的命令来测试工具提示是否已成功加载
      • 您的示例代码正在运行（请参见此），因此可能缺少javascript引用

      要使用工具提示，您需要在对jquery的引用之后包含
      bootstrap.js
      （与所有插件一起）或至少包含
      bootstrap tooltip.js
      （请参阅上的选项）

      （在下面的用户评论之后）

      我建议现在检查两件事：

      • 在
        Net
        选项卡上，尝试查找对
        bootstrap.min.js
        文件的请求，并查看它是否成功完成
      • 在
        控制台
        选项卡上，运行选择器
        $（'a[rel=“tooltip”]，…
        ，查看它是否找到标记；如果找到，您应该能够调用类似
        $（'#元素'）。tooltip（'show'）
        的命令来测试工具提示是否已成功加载
      我所看到的最常见的问题是，人们忘记了在工具提示中包含CSS。您在控制台中是否有任何错误？如果您不使用自定义JS实现工具提示，工具提示是否有效？@AGoodDisplayName我也包括来自Google CDN的jQuery，我从他的@Mooseman获得TB不，这是问题，我没有收到任何错误，所以我不知道从哪里查找错误我所看到的最常见的问题是，人们忘记了在工具提示中包含CSS。你在控制台中是否有任何错误？如果你不使用自定义JS实现工具提示，工具提示会工作吗？@AGoodDisplayName我也包括来自Google CDN的jQuery，我从他的@Mooseman获得TB不，这是专业版问题我没有收到任何错误，因此我不知道在哪里查找错误您显示了对引导css文件的引用。关于js文件，您是否检查了引用是否在那里，以及标记是否在jquery的标记之后？@Reynier因此，请用小提琴创建您的示例，以帮助我们找到您的问题。@FelipeCastro它也包括在内，有关更多信息，请参阅我看它是在html中引用的，而不是肯定包含在内（它可能指向错误的路径）。请查看我的编辑above@FelipeCastro回答您的问题
      bootstrap
      加载正常，我不知道如何运行您留下的代码
      $（“#元素”）。工具提示（'show'）
      或者我不理解你的观点。我想我找到了问题所在。我也在使用jQuery UI，并且在最新版本中出现了，所以在某种程度上，来自jQuery UI的CSS和JS正在覆盖TB，对此有什么帮助吗？你显示了对引导CSS文件的引用。关于JS文件，你检查了引用了吗？以及标记是在jquery的标记之后吗？@Reynier所以请用fiddle创建您的示例，以帮助我们找到您的问题。@FelipeCastro它也包括在内，请参阅以获取更多信息我看到它在html中被引用，而不是肯定包括在内（它可能指向错误的路径）.请看我的编辑above@FelipeCastro回答您的问题
      bootstrap
      加载正常，我不知道如何运行您留下的代码
      $（“#元素”）。工具提示（'show'）
      或者我不理解你的观点。我想我找到了问题所在。我也在使用jQuery UI，并且在最新版本中出现了，因此jQuery UI中的CSS和JS在某种程度上覆盖了TB，有什么帮助吗？ 
      <link href="/catalog/view/theme/viaenvia/stylesheet/bootstrap.min.css" rel="stylesheet">
<link href="/catalog/view/theme/viaenvia/stylesheet/font-awesome.css" rel="stylesheet">
<link href="/catalog/view/theme/viaenvia/stylesheet/bootstrap-responsive.min.css" rel="stylesheet">

      <link rel="stylesheet" href="/catalog/view/theme/viaenvia/stylesheet/bootstrap.min.css" />
<link rel="stylesheet" href="/catalog/view/theme/viaenvia/stylesheet/font-awesome.css">
<link rel="stylesheet" href="/catalog/view/theme/viaenvia/stylesheet/bootstrap-responsive.min.css" />

<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/ui-lightness/jquery-ui.css">
<link rel="stylesheet" href="/catalog/view/theme/viaenvia/stylesheet/style.css">
<link rel="stylesheet" href="/catalog/view/theme/viaenvia/stylesheet/flexslider.css">
<link rel="stylesheet" href="/catalog/view/theme/viaenvia/js/fancybox/jquery.fancybox.css">