簡體   English   中英

與JQuery ajax選項卡不同地顯示所選選項卡

[英]Showing selected tabs differently with JQuery ajax tabs

我的標簽中包含這樣的預加載內容:

$(function () {

    $('div.tabs ul.tabNavigation a').click(function () {
        $('div.tabs ul.tabNavigation a').removeClass('selected');
        $(this).addClass('selected');
        return false;
    }).filter(':first').click();
});

這將class =“ selected”添加到鏈接和CSS中,使selected選項卡看起來不同

<div class="tabs"> 
    <ul class="tabNavigation"> 
        <li><a href="#content1">c1</a></li> 
        <li><a href="#content2">c2</a></li> 
        <li><a href="#content3">c3</a></li>
    </ul> 
    <div id="content1"> 
         content 1
    </div> 
    <div id="content2">
         content 2
     </div> 
     <div id="content3"> 
        content 3 
     </div>

現在,我正在嘗試使Ajax工作。 好吧,它正在工作,但是我有麻煩讓Class =“ selected”進入我的鏈接。

帶有ajax的js函數如下所示:

$(function() {
    $("#tabs").tabs({
        ajaxOptions: {
            error: function(xhr, status, index, anchor) {
                $(anchor.hash).html("there was a problem");
            }
        }
    });
});

我如何擴展它,以便它給單擊的鏈接類“選定”? 與預加載的內容版本相似。

$(function() {  
    $("#tabs").tabs({
        ajaxOptions: {
            error: function(xhr, status, index, anchor) {
                $(anchor.hash).html("Laadimisel ilmnes viga");
            }
        }
    });
    $('#tabs A').click(function(){
        if($(this).hasClass('selected')){ return false; }

        $('#tabs A.selected').removeClass('selected');
        $(this).addClass('selected');       
        return false;
    });
});

這工作了。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM