0

みんな私はこのコードのためにたくさん試しましたが、javascriptからjqueryへの変換には何も出てきません..

このコードは無関係です。作業中のフィドルでこれを見つけることができます..私はこのコードのチャンクを追加しました.スタックオーバーフローはコードなしで投稿することを許可しません..

<div class="rButtons">
<input type="radio" name="numbers" value="10" onclick="uncheck();" />10
<input type="radio" name="numbers" value="20"  onclick="uncheck();" />20
<input type="radio" name="numbers" value="other" onclick="check(this);"/>other
<input type="text" id="other_field" name="other_field" onblur="checktext(this);"/>
</div>

このフィドルをチェックしてください

http://jsfiddle.net/gDxqj/

それはうまくいっています。「その他」のラジオ ボタンをクリックすると、テキスト フィールドが表示され、他のラジオ ボタンをクリックすると消えます。これがこのスクリプトの機能であり、うまく機能しています。

今、それをjqueryコードに変更しようとすると、それは死にました.. jqueryで作成したコードを表示できますが、助けにはなりません..

同じことをフィドルすることは大いに役立ちます..

前もって感謝します..

これは私がしたことです

<script>
var $radios = $('input:radio[name=numbers]');
    if ($radios.is(':checked') === true) {
       $("#other_field").show();
    }     
    else
    {
       $("#other_field").hide();
    }   
</script>

それを関数に入れて、ラジオボタンの「onchange」で呼び出しましたが、機能しませんでした

4

3 に答える 3

3
$(':radio').on('change', function () {
  $('#other_field')[$(this).val() === 'other' ? 'show' : 'hide']();
});

$('#other_field').on('blur', function () {
  var val = $(this).val();

  if(isNaN(val)) {
    alert('only numbers are allowed..');
  }
  else if(parseInt(val, 10) % 10 > 0) {
    alert('only multiples of 10..');
  }
});

と:

<div class="rButtons">
  <input type="radio" name="numbers" value="10" /> 10
  <input type="radio" name="numbers" value="20" /> 20
  <input type="radio" name="numbers" value="other" />other
  <input type="text" id="other_field" name="other_field" />
</div>

デモ: http://jsfiddle.net/BZGsw/

于 2013-01-23T19:47:33.153 に答える
1

からonclickandを削除し、jQuery を使用してイベントをアタッチするだけです。onblurinput

$(function(){
    $('.rButtons').on('click', 'input[type="radio"]', function(ev){
        var val = $(this).val();
        val == 'other' ? check(this) : uncheck();
    });
    $('.rButtons').on('blur', '#other_field', function(ev){
        checktext(this);
    });
});

デモを見る

于 2013-01-23T19:45:38.760 に答える
1

.change()イベントをビンに使用しchangeて、選択したラジオ ボタンの状態を確認し、適用.toggle()#other_fieldて表示または非表示にすることができます。

#other_field {
    display: none;
}

<div class="rButtons">
    <input type="radio" name="numbers" value="10">10
    <input type="radio" name="numbers" value="20">20
    <input type="radio" name="numbers" value="other">other
    <input type="text" id="other_field" name="other_field">
</div>

$("[name=numbers]").change(function() {
    $("#other_field").toggle(this.value === "other");
});

$("#other_field").change(checktext);

の代わりにdisplayset toを使用するように CSS を変更しました。nonevisibility

こちらをご覧ください。

于 2013-01-23T19:48:29.927 に答える