1

タブに問題があります (を使用li)。この状況を解決する方法がわかりません：タブ（タブリンク）をクリックしてもタブのコンテンツは表示されませんが、タブをもう一度ホバーするとタブのコンテンツが表示されます。（最初のクリックだけでタブの内容が表示されません）

前もって感謝します！

HTML: 

<div id="tabs">
        <ul id="tabstest">
        <li id="first_tab" style="width:200px; height:40px;"><a href="#tab1" class="active tab_link" onclick="window.location.href = '\auto.php';"><strong>Auto</strong></a></li>
        <li style="width:180px; height:40px; line-height: 12px;"><a href="#tab2" class="tab_link" onclick="window.location.href = '\automk.php';"><strong><br>Automk</strong></a></li>
        <li style="width:120px; height:40px;"><a href="#tab3" class="tab_link" onclick="window.location.href = '\info.php';"><strong>Info</strong></a></li>
        <li style="width:180px; height:40px; line-height: 12px;"><a href="#tab4" class="tab_link" onclick="window.location.href = '\tteleko.php';"><strong><br>Teleko</strong></a></li>
        <li style="width:120px; height:40px; line-height: 12px;"><a href="#tab5" class="tab_link" onclick="window.location.href = '\pamet.php';"><strong><br>Pamet</strong></a></li>
        <li id="last_tab" style="width:100px; height:40px; line-height: 12px;"><a href="#tab6" class="tab_link" onclick="window.location.href = '\rracun.php';"s><strong><br>Računari</strong></a></li>
    </ul>
    </div>
    <div id="tabcontents" >
        <div id="tab1" class="tabcontent">
        <img src="/images/baner22.jpg" width="200" height="150" alt="Slideshow Image 2" title="Slideshow Image 2" style="float:left; margin:5px 5px 5px 5px;"/>
        <p style="margin:5px 5px 5px 5px;">tab1 content</p>
        </div>
        <div id="tab2" class="tabcontent">
        <p>tab2 content</p>
        </div>
        <div id="tab3" class="tabcontent" >
        <p>tab3 content</p>
        </div>
        <div id="tab4" class="tabcontent">
        <img src="images/baner22.jpg" width="947" alt="Slideshow Image 2" title="Slideshow Image 2" />
        </div>
        <div id="tab5" class="tabcontent">
        <img src="/images/baner32.jpg" width="947" alt="Slideshow Image 2" title="Slideshow Image 2" />
        </div>
        <div id="tab6" class="tabcontent">
        <img src="/images/banner35.jpg" width="947" alt="Slideshow Image 2" title="Slideshow Image 2" />
        </div>
    </div>

JQuery:

  $("#tabstest li").click(function() { 

          ????

});


 $("#tabstest li").hover(function () {

$("#tabstest li").removeClass('active');

    $(this).addClass("active");

  var selected_tab = $(this).find("a").attr("href");

    $(selected_tab).fadeIn();

          }, function () {

$("#tabstest li").removeClass('active');

  var selected_tab = $(this).find("a").attr("href");

    $(selected_tab).hide();
});
4

1 に答える 1

0

このようなことができます。最初のクリックでは何もしません。ただし、最初にクリックすると、データが表示されます。

var clickCount = 0;
$("#tabstest li").click(function() { 
     if (clickCount > 1) {
        $(this).addClass("active");
        var selected_tab = $(this).find("a").attr("href");
        $(selected_tab).fadeIn();
     }
     clickCount++;
});


 $("#tabstest li").hover(function () {

$("#tabstest li").removeClass('active');

    $(this).addClass("active");

  var selected_tab = $(this).find("a").attr("href");

    $(selected_tab).fadeIn();

          }, function () {

$("#tabstest li").removeClass('active');

  var selected_tab = $(this).find("a").attr("href");

    $(selected_tab).hide();
});
于 2013-01-17T10:25:31.250 に答える