1

TwitterBootstrapチェックボックスグループのグループが複数あります。チェックボックスボタンのいずれかがクリックされたときに、すべてのアクティブな（つまり、Bootsrtapが「アクティブな」クラスを追加する）ボタンのハッシュを作成したいと思います。数回クリックした後、htmlがそのようになっていると仮定します。

<div id="horizontal" class="btn-group" data-toggle="buttons-checkbox">
  <button class="btn active" data-hposition="1">Left</button>
  <button class="btn" data-hposition="2">Middle</button>
  <button class="btn active"data-hposition="3">Right</button>
</div>
<div id="vertical" class="btn-group" data-toggle="buttons-checkbox">
  <button class="btn" data-vposition="1">Top</button>
  <button class="btn active" data-vposition="2">Center</button>
  <button class="btn active" data-vposition="3">Bottom</button>
</div>

私はたった1つのdivで単純に始めましたが、正しい結果が得られません：

<script>
  $('#horizonatal').click( function(){
      var paramsHash = {};
      var hids = [];
    $('.active').each( function() {
      paramsHash.hids.push($(this).data('hposition'));
  })
      console.log(paramsHash.hids);    
})
</script>

上記のhtmlを使用して、「右」をクリックすると[1,undefined]、コンソールに次のようなものが表示されます。

最終的に、私は次のように投稿するためのハッシュを取得したいと思います{ {'hids', [ 1, 3 ]}, {'vids', [ 2, 3, ]} }

jsfiddleを試しましたが、ボタンがアクティブになっていないため、Bootstrapを正しくロードしていないと思います。

4

1 に答える 1

0

これは、データ属性（フィドル上）にタイプミスがあり、水平div.activeに属していないすべてのクラスを選択し、 data-hposition属性がないため、未検出を返すためです。次のことを試してください。

$('#horizontal').click( function(){
      var paramsHash = {
              hids: [],
            //vidz: []
          }
    $('.active', this).each( function() {
      paramsHash.hids.push($(this).data('hposition'));
   // paramsHash.vidz.push($(this).data('classroom'));
    })
      console.log(paramsHash);    
})

デモ

これらはラジオボタンではなくボタンタグ であることに注意してください。

于 2012-07-28T15:54:14.580 に答える