JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<div id="tabs">
<ul>
<li><a href="#tabs-1">Tablets</a></li>
<li><a href="#tabs-2">Bring-your-own</a></li>
<li><a class='singlelink' href="#tab-3" rel="http://www.google.com">Goto Exteral link</a></li>
</ul>
<div id="tabs-1">
tab 1 content goes here
</div>
<div id="tabs-2">
tab 2 content goes here
<input type=submit value="submit" onclick="alert('test')"/>
</div>
<div id="tabs-3">
</div>
</div>
JavaScript
jQuery(document).ready(function(){
jQuery( "#tabs" ).tabs({
beforeActivate: function (event, ui) {
if(event.currentTarget.rel)
window.location.href = event.currentTarget.rel;
else
window.location.href = event.currentTarget.href;
}
})
})