0

我有功能:

 <script type="text/javascript">
    $(document).ready(function () {
        $('#myTab a').click(function (e) {
            e.preventDefault();
            if ($(this).attr('href') === ('#' + $('#myTabContent').children('div').attr('id'))) {
                alert($(this).attr('href'));
            }
        });
    });
</script>

和标记:

 <ul id="myTab" class="nav nav-tabs">
    <li><a href="#vergiSK" data-toggle="tab">
        </a></li>
    <li><a href="#spkSK" data-toggle="tab">
        </a></li>
    <li><a href="#hukukSK" data-toggle="tab">
       </a></li>
</ul>
<div id="myTabContent" class="tab-content">
    <div class="tab-pane fade" id="vergiSK">
     <ul>
        <li></li>
        <li></li> 
     </ul>
   </div>
    <div class="tab-pane fade" id="spkSK">
      <ul>
        <li></li>
        <li></li> 
     </ul>
    </div>
    <div class="tab-pane fade" id="hukukSK">
      <ul>
        <li></li>
        <li></li> 
     </ul>
    </div>
 </div>

问题是,当我单击“ a ”元素之一时,我只得到具有第一个 ID 的元素。如何获得所有匹配的“ href ”和“ id ”的值?

4

1 回答 1

2

如果您尝试获取div与您单击的锚点相关的内容,则:

<script type="text/javascript">
    $(document).ready(function () {
        $('#myTab a').click(function (e) {
            var $div = $($(this).attr("href"));
            // Do something with the div
        });
    });
</script>

之所以有效,是因为href您正在使用的 (#vergiSK等) 的值是一个有效的 ID 选择器,因此您可以将其直接传递$()给以获取一个包裹在具有该 ID 的元素周围的 jQuery 对象。请注意,我使用$(this).attr("href")的是获取href而不是仅获取this.href,这将被扩展(因此会有完整的 URL,而不仅仅是href属性的实际内容)。

实时示例(单击相应链接时,div 会短暂变为红色)| 来源

但是,如果出于其他原因您想遍历 的#tab-content子元素的元素,则可以使用each.

$('#myTabContent').children('div').each(function() {
    // Raw DOM element for each child `div` is `this`
});
于 2013-03-29T14:47:25.127 回答