JQuery вкладка с помощью кнопки радио проверяется вместо ссылок щелчка

Question

я хочу сделать вкладки JQuery, но на этот раз я хочу, чтобы ушки тумблера зависит от проверки кнопки радио не только ссылки нажмите это обычные вкладки JQuery

<div id="tab-container" class="tab-container"> 
    <ul class='etabs'> 
    <li class='tab'><a href="#tabs1-html">HTML Markup</a></li> 
    <li class='tab'><a href="#tabs1-js">Required JS</a></li> 
    <li class='tab'><a href="#tabs1-css">Example CSS</a></li> 
    </ul> 
    <div id="tabs1-html"> 
    <h2>HTML Markup for these tabs</h2> 
    <!-- content --> 
    </div> 
    <div id="tabs1-js"> 
    <h2>JS for these tabs</h2> 
    <!-- content --> 
    </div> 
    <div id="tabs1-css"> 
    <h2>CSS Styles for these tabs</h2> 
    <!-- content --> 
    </div> 
</div> 

<script src="/javascripts/jquery.js" type="text/javascript"></script> 
<script src="/javascripts/jquery.hashchange.js" type="text/javascript"></script> 
<script src="/javascripts/jquery.easytabs.js" type="text/javascript"></script> 
$('#tab-container').easytabs(); 


.etabs { margin: 0; padding: 0; } 
.tab { display: inline-block; zoom:1; *display:inline; background: #eee; border: solid 1px #999; border-bottom: none; -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; } 
.tab a { font-size: 14px; line-height: 2em; display: block; padding: 0 10px; outline: none; } 
.tab a:hover { text-decoration: underline; } 
.tab.active { background: #fff; padding-top: 6px; position: relative; top: 1px; border-color: #666; } 
.tab a.active { font-weight: bold; } 
.tab-container .panel-container { background: #fff; border: solid #666 1px; padding: 10px; -moz-border-radius: 0 4px 4px 4px; -webkit-border-radius: 0 4px 4px 4px; } 

здесь ссылка для этого toutrial ----- http://os.alfajango.com/easytabs/#tabs1-css

Я хочу сделать так, как это сделать, но вместо того, чтобы сделать действие произошло, когда нажимайте ссылки на ссылки, которые я хочу поместить, и это действие произошло, когда радио проверено но я не знаю, как

здесь ссылка для другого примера для стандартных вкладок jquery http://jqueryui.com/tabs/

Answer 1

В документации указано, что единственным требованием для использования easytabs является список с элементами a. Я предполагаю, что api действительно не требует элементов a, но прислушивается к изменению URL-адреса хэш-части. То, что вы можете сделать, в основном имитирует это поведение, вручную устанавливая URL-адрес при нажатии на переключатель.

HTML

<ul id="tab-radio-buttons"> 
    <li><input type="radio" data-href="tab-1" /></li> 
    <li><input type="radio" data-href="tab-2" /></li> 
    <li><input type="radio" data-href="tab-3" /></li> 
</ul> 

JS

$("#tab-radio-buttons input").click(function() { 
    window.location.hash = $(this).attr("data-href"); 
});