jQuery Mobile - Including not collapsible elements in collapsible set - jquery-mobile

Question

In my list some elements have sub-items and some not. These, that don't have have sub-items should work as buttons/links.
Unfortunately including an item like in my collapsibleset
<div data-role="collapsible" data-iconpos="none">
<h3 >Title</h3>
</div>
and setting in JS a's href to needed link looks great, but JQM triggers open/closing event by clicking on it. That changes it's look and my link inside the element doesn't work.
Does someone have ideas?

Answer 1

Is that what you want ?
JsFiddle
$("h3").on("click", function(e){
$(this).parent().collapsible({collapsed: true});
});
It prevents the collapsible to open
If you need the collapsible to stay in the state it is when the page
is loaded, you can check the state of the collapsible with
$(".ui-collapsible").hasClass('ui-collapsible-collapsed')
and let it open if it is already open, or close if it is already
close.
JsFiddle
You could use that if you have a button inside your collapsible
header, and do not want the collapsible to react when you click on
the button but still on the header (outside the button) Final
working exemple : JsFiddle
Edit : As you requested in the comments, here is a JsFiddle with a collapsible header opening a website on click instead of collapsing/expanding the collapsible.
Explanation :
1) You could store the url in an attribute of the "h2" like this :
<h2 data-url="google.com"; >google.com</h2>
2) Then you add a class when you don't want the heading to collapse/expand the collapsible : class="doNotTriggerCollapsible"
So you have :
<h2 class="doNotTriggerCollapsible" data-url="google.com"; >google.com</h2>
3) Then you retrieve the url with $(this).data("url") and you open the link with
window.open($(this).data("url"))