jQuery ui accordion normal links

I'm using jQuery UI accordion(). I have 4 tabs. I want to make 2 sliding which is the way accordion works, and the other 2 just normal links without sliding. I can't figure out how to do normal link since accordion expects an element for content after the <h3> tag

<div id="test">
    <h3><a href="#">One</a></h3>
    <div>
        some text
    </div>
    <h3><a href="#">Two</a></h3>
    <div>
        some text
    </div>
    <h3><a href="whatever.html">Link</a></h3>
    <h3><a href="whatever1.html">Link开发者_运维百科</a></h3>
</div>

Check http://jsfiddle.net/3JAkv/

Looking at the accordion methods(http://jqueryui.com/demos/accordion/), I don't recognize anything for locking an item unopenable.

Why don't you just take the

 <h3><a href="whatever.html">Link</a></h3>
<h3><a href="whatever1.html">Link</a></h3>

outside of the <div id="test"> div and just style them properly?

Also, you could have a different selector for header, which will disable the item. For example: i changed the last two links to h2 and set the accordion to use h3 as header:

$('#test').accordion({ header: 'h3' })

and

<h2><a href="whatever.html">Three</a></h2>
<h2><a href="whatever1.html">Four</a></h2>

you can see it here: http://jsfiddle.net/3JAkv/5/

you still have to skin it with CSS though

You can alter the click on the last 2 tabs via jquery:

$('h3 span').slice(2) // accordion adds a span to put the triangle icon
                      // deactivate the click on it
                      // slice(2) to take last 2 tabs
            .click(function(){
    return false;     // deactivate the click
});

$('h3 a').slice(2).click(function(){
    location.href = $(this).attr('href'); // redirect the page to
                                          // the href of current anchor
    return false;                         // deactivate the click
});

jsfiddle: http://jsfiddle.net/3JAkv/7/

Took me a couple of days but I finally found an answer.

Build out your accordion as suggested in the documentation with empty divs below your headings that don't have sub entries. Then you need these two functions.

//make links work in accordion headers
$("#accordion h3 a").click(function() {
    window.location = "default.html"+$(this).attr('href');
    window.location.reload();
    return false;
});

//cycle through each header, checking if the next div has html and remove ui-icon class if it doesn't
$("#accordion h3").each(function(index) {
    if ($(this).next("div").html() == "") {
        $(this).children("span").removeClass("ui-icon");
    }
});

I think you should take the links out of the accordion:

<div id="textParent">
    <div id="test">
        <h3><a href="#">One</a></h3>
        <div>
            Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
        </div>
        <h3><a href="#">Two</a></h3>
        <div>
            Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
        </div>
    </div>
    <h3><a href="whatever.html">Three</a></h3>
    <h3><a href="whatever1.html">Four</a></h3>
</div>

Hope this helps. Cheers