ブートストラップでリンクをクリックできるようにするチェックボックステキスト

Question

私は、BootstrapとFontAwesomeの組み合わせを使用して、タッチ可能なチェックボックスコントロールを作成しています。チェックボックスのテキストラベルの一部として、別のページへのリンクを含めたいと思いますが、動作していないようです。私は問題を引き起こしているBootstrap JavaScriptでstopPropagation（）呼び出しが行われていると推測していますが、その周りには方法が見つかりません。私のHTMLコードは以下の通りです。ここで

<div class="btn-touch btn-group btn-group-vertical" data-toggle="buttons"> 
    <label class="btn" for="cbAgree"> 
     <input id="cbAgree" type="checkbox" name="cbAgree" /> 
     <i class="fa fa-square-o fa-2x"></i> 
     <i class="fa fa-check-square-o fa-2x"></i> 
     <span>I agree to the <a href='http://www.google.com' target='_blank'>Terms & Conditions</a></span> 
    </label> 
</div> 

は、より良い、ISSを示しフィドルです： https://jsfiddle.net/bepsh3wt/

Answer 1

提供されたリンクcbrawlには解決策がありました。下のjqueryは私の問題を解決しました、ありがとう！

$('.btn-touch').on('click', 'label a', function (e) { 
    event.stopPropagation(); 
    event.preventDefault(); 
    window.open($(this).attr('href'), $(this).attr('target')); 
    return false; 
}); 

Answer 2

私はここにあなたの例を更新：https://jsfiddle.net/bepsh3wt/4/

それは<form>タグを必要とし、必要に応じて、あなたが入力を非表示にすることができます：チェックボックス

<div class="btn-touch btn-group btn-group-vertical" data-toggle="buttons"> 
<form> 
    <label class="btn" for="MainContent_MainContent_lvTrip_cbYCJAgree_0"> 
     <input id="MainContent_MainContent_lvTrip_cbYCJAgree_0" type="checkbox" name="ctl00$ctl00$MainContent$MainContent$lvTrip$ctrl0$cbYCJAgree" /> 
     <i class="fa fa-square-o fa-2x"></i> 
     <i class="fa fa-check-square-o fa-2x"></i> 
     <span>I agree to the <a href='/Terms' target='_blank'>Terms & Conditions</a></span> 
    </label> 
</form> 
</div>