javascript - 上塗りスイッチコンポーネントと選択。イベントと状態をオンまたはオフにする最良の方法は?

Question

私は最初の phonegap アプリを作成しており、トップコートを美化 (純粋な css) demopageとして使用しています。すべてが CSS ベース (ハードウェア アクセラレーション) であるため、トップコートはモバイル アプリに最適です。ただし、すべてが CSS ベースであるため、DOM 状態の操作/読み取りに役立つ JavaScript はありません。これは、ほとんどのトップコート コンポーネント (ボタンのクリックや入力へのテキストの入力など) では問題ありません。ただし、オン/オフ スイッチ コンポーネントは実際には派手な html チェックボックスであり、クリックすると css-transition でオンまたはオフに切り替わります。とてもいいのですが、チェックボックス自体が更新されません (トップコートのバグ?)。私はうまくいく解決策を持ってきましたが、これが進むべき道なのか、なぜ推奨されたjqueryを使用できないのか疑問に思っています.

jsfiddleデモ

<label class="topcoat-switch">
   <input id="testcheck" type="checkbox"  name="testd" class="topcoat-switch__input">
   <div class="topcoat-switch__toggle"></div>
</label>



$('#testcheck').change(function(){
    var el=$(this);
    el.attr("checked", !el.attr("checked"));

    alert(el.attr("checked")?'callback true':'callback false');
});