1

a：href属性タグを使用してdivをスワップアウトするこのスクリプトがあります。代わりに、title属性を持つdivタグを使用したいと思います。

作業コード

$(document).ready(function () {
    $('#tabs div').hide();
    $('#tabs div:first').show();
    $('#tabs2 ul li:first').addClass('active');

    $('#tabs2 ul li a').click(function () {
        $('#tabs2 ul li').removeClass('active');
        $(this).parent().addClass('active');
        var currentTab = $(this).attr('href');
        $('#tabs div').hide();
        $(currentTab).fadeIn(1000);
        return false;
    });
});

これをdivタグで使用しようとしましたが、機能していません

<div id="tabs2">
  <ul class="nav">
    <li class="pc"><div class="tab-1" title="tab-1">text</div></li>
  </ul>
</div>

$(document).ready(function () {
    $('#tabs div').hide();
    $('#tabs div:first').show();
    $('#tabs2 ul li:first').addClass('active');

    $('#tabs2 ul li div').click(function () {
        $('#tabs2 ul li').removeClass('active');
        $(this).parent().addClass('active');
        var currentTab = $(this).attr('title');
        $('#tabs div').hide();
        $(currentTab).fadeIn(1000);
        return false;
    });
});

エラーは発生しませんが、何らかの理由で機能しません。

4

2 に答える 2

2

ここでセレクターの先頭に「＃」がありません。

$(currentTab).fadeIn(1000);

これは、$('tab-1')いつ$になるべきかという結果になります('#tab-1')

a[href]おそらく。のようなものを使用しているので、属性を使用しているときに機能すると思いますhref="#tab-1"。

于 2012-08-14T23:04:54.697 に答える
1

指定したHTMLでは、title属性はtab-1です。
したがって、その値を取得するcurrrentTabと、テキストのみが含まれますtab-1。

を追加し#て、IDがtab-1：の要素を選択します。

$('#' + currentTab).fadeIn(1000);

または、を追加し.て、クラスがtab-1：の要素を選択します。

$('.' + currentTab).fadeIn(1000);
于 2012-08-14T23:05:22.023 に答える