javascript - jquery-1.9.1.js :4421 Uncaught Error: Syntax error, 无法识别的表达式:/item/category/category_details/7

Question

我正在尝试实现 Bootstrap 制表菜单，每个选项卡都是一个新页面

这是我的java脚本

 <script type="text/javascript">
          $(document).ready(function(){
              $(".nav-tabs a").click(function(){
                  $(this).tab('show');
              });
              $('.nav-tabs a').on('shown.bs.tab', function(event){
                  var x = $(event.target).text();         // active tab
                  var y = $(event.relatedTarget).text();  // previous tab
                  $(".act span").text(x);
                  $(".prev span").text(y);
              });
          });
      </script> 

这是我的制表菜单 html

<div class="container">
  <h2>Material</h2>
  <ul class="nav nav-tabs">
    <li role="presentation" class="active">
        <a  href="/item/material/material_details/7">BOM</a></li>
    <li role="presentation"><a href="/item/category/category_details/7">Manufacture</a></li>
    <li role="presentation"><a href="/item/material/material_details/7">Product</a></li>
    <li role="presentation"><a href="/item/material/material_details/7">UOM</a></li>
  </ul>

在每次选择新选项卡时出现的错误下方，显然我的选项卡不会更改为事件状态。我假设我正在尝试一些不打算与直接链接一起使用但应该只与同一页面上的 div 一起使用的东西。有没有一种方法可以通过这种方式获得列表效果而无需为每个页面单独设置事件选项卡菜单？

jquery-1.9.1.js:4421 Uncaught Error: Syntax error, unrecognized expression: /item/category/category_details/7

Answer 1

Bootstrap tabs expect the href to be a hash它被 jQuery 解析为一个选择器，特别是一个 ID 选择器。该散列对应于要显示的部分的 ID。您的 href 似乎是 url 而不是哈希，导致它失败。