-2

jQueryを使用してdivの内容を置き換える最良の方法は何でしょうか?これが私のアプリケーションの例です:

<div id="size">
    <p>Waiting for item</p>
</div>

アイテムが選択されると、サイズはアイテムタイプに応じてsize-sml(jqueryボタンセット)またはsize-lのいずれかになります。

<div id="size-sml" style="display: none">
    <input id="s_r1" name="radio" type="radio"><label for="s_r1">Small</label>
    <input id="s_r2" name="radio" type="radio"><label for="s_r2">Medium</label>
    <input id="s_r3" name="radio" type="radio"><label for="s_r3">Large</label>
</div>

また

<div id="size-l" style="display: none">
    <label for="liters">Volume in liters: </label>
    <input id="liters">
</div>

.html()を使用してdivを変更していましたが、小さい中大きいボタンの1つを押すたびに、「初期化前にボタンのメソッドを呼び出せません。メソッド'widget'を呼び出そうとしました」というエラーが発生しました。通常のテキスト入力は正常に機能します。

JavaScript:

var size = $( "#size" );
var types = $( "#types" ); //jQuery buttonset
types.click( function() {
    sizeType = $( "#types :radio:checked" ).attr( "st" );
    if ( sizeType == "G" ) {
        size.html( $( "#size-sml" ).html() );
        size.buttonset();
    } else if ( sizeType == "L" ) {
        size.html( $( "#size-l" ).html() );
    }
});
4

1 に答える 1

0

#typesのマークアップ、またはそれを初期化したjavascriptを提供しなかったため、何が間違っていたのか、なぜそのエラーが発生したのか完全にはわかりません。私は提供されたものからそれらの部分を再構築しました、そしてそれは私のために働いているようです。コードへのいくつかの小さな変更:

Plunk: http: //plnkr.co/edit/7dvzrb0Mzpg80bApmTmi ?p=preview

$(function(){
  $("#types").buttonset();
  $("#types :radio").click(function(e) {
      var sizeType = $(this).attr( "st" );
      if ( sizeType == "G" ) {
      $("#size").html( $( "#size-sml" ).html() )
                .buttonset();
      } else if ( sizeType == "L" ) {
          ("#size").html( $( "#size-l" ).html() );
      }
    });
});

あなたの問題の根本は、単一の結果を返さないsizeType = $( "#types :radio:checked" ).attr( "st" );これであると私は信じています。そのため、親のクリックイベントの代わりに、である子にクリックイベントを配置します。:radio

于 2013-03-20T19:57:49.780 に答える