Question

我正在尝试使用jquery修改我的ul以兼容bootstrap。我有大部分代码工作正常，但由于某种原因，我的锚标记不受我的jquery代码的影响。这是它应该是什么样子：

  <ul class="nav navbar-nav">
    <li class="active"><a href="#">Home</a></li>
    <li><a href="#about">About</a></li>
    <li><a href="#contact">Contact</a></li>
    <li class="dropdown">
      <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
      <ul class="dropdown-menu">
        <li><a href="#">Action</a></li>
        <li><a href="#">Another action</a></li>
        <li><a href="#">Something else here</a></li>
        <li class="divider"></li>
        <li class="dropdown-header">Nav header</li>
        <li><a href="#">Separated link</a></li>
        <li><a href="#">One more separated link</a></li>
      </ul>
    </li>
  </ul>

你可以在这里看到我到目前为止做了什么：

http://jsfiddle.net/grem28/NL5M8/

如果检查商店锚点，您将看到未添加类，数据切换和插入符号。非常感谢任何和所有的帮助！谢谢!!

达明

Answer 1

您的选择器.bootstrapNav > li > ul错误，li不是bootstrapNav的孩子，ul的孩子在bootstrapNav内，所以更改选择器到$('.bootstrapNav > ul > li > ul')或$('.bootstrapNav li > ul')

$('.bootstrapNav li > ul').addClass('dropdown-toggle').parent('li').addClass('dropdown').find('a:first').attr('data-toggle', 'dropdown').addClass('dropdown-toggle').append('<span class="caret"></span>');

演示：Fiddle

Answer 2

bootstrapNav>li

不存在，您可能需要bootstrapNav>ul>li

http://jsfiddle.net/NL5M8/1/

使用jquery将类和标记添加到列表中的第一个链接

2 个答案: