0

ドロップダウンから値を選択するか、フリー テキストを入力できるアイテムのリストがあります。クリックすると、ドロップダウンまたはテキスト ボックスの横にあるラジオ ボタンが自動的に選択されるようにしたいと思います。

私は持っている：

<script type="text/javascript">
  $(".click_radio").click(function() {  
    $(this).find('input[type=radio]').prop('checked', true);
  });
</script>

<html>
  <table>
    <tr>
      <td><input type="checkbox" name="ord_55" value="yes" /> Sodium Chloride </td>
      <td><input type="RADIO" name="dose" value="drop"/> &nbsp;
        <select id="drop_dose_1" name="nsbolus_drop_dose" class="click_radio">
          <option></option>
          <option>250</option>
          <option>500</option>
          <option>1000</option>
        </select> ml
      </td>
      <td><input type="RADIO" name="dose" value="text"/> &nbsp; 
        <input type="text" size="4" id="text_dose_1" name="nsbolus_text_dose" value="" class="click_radio"/> ml
      </td>
      <td><select name="nsbolus_pri">
          <option>STAT</option>
          <option>NEXT SCH</option>
          <option>1ST DOSE TODAY</option>
        </select></td>
    </tr>
  </table>
</html>

直接トリガーすることもできますが、これに続く数十の同様のアイテムのいずれに対しても機能するユニバーサル スクリプトが本当に必要です。

ありがとう！

編集 私はJQuery 1.9.1を使用していることにも言及する必要があります

4

3 に答える 3

1

あなたはすでに良い答えを持っていますが、現在の答えはあなたが持っている選択ボックスに対処できないので、私は私のものを追加すると思いました。

ここに実用的なフィドルがあります: http://jsfiddle.net/CBRc4/1/

私が行った変更は非常に単純です。関数を再利用可能にし、2 種類のイベントをリッスンします。正しいラジオを選択して確認するには、単純に を使用します.siblings(selector)。

フィドルのコードは次のとおりです。

var eventHandler = function() {
  $(this).siblings('input[type=radio]').prop('checked', true);
};

$(function() {
  $(".click_radio").on({
    click: eventHandler,
    change: eventHandler
  });
});

クリックと変更の両方に同じハンドラーを再利用して、同じ機能を確保していることがわかります。

編集: ここで jQuery 1.9.1 を使用した作業例http://jsfiddle.net/CBRc4/2/

元の例が 1.9.1 の jQuery で機能しない理由についての注意は、型宣言type="RADIO"とinput[type=radio]. どちらかを一致するように変更すると、選択が正常に実行されます (ほとんどの場合、Sizzle セレクター エンジンに関する変更です)。しかし、この例は、変更が行われた後に 1.9.1 で動作し、動作中の 1.9.1 フィドルにリンクしました。

于 2013-09-04T19:30:58.583 に答える
0

要素が両方とも同じコンテナー内にある限り、siblings([selector])を使用できます。必要に応じて、入力の rel 属性にセレクターを指定し、onclick で rel をセレクターとして使用して、適切な他の要素をトリガーまたは設定することができます。

$("text_dose_1").on('click', function() { this.siblings('input[type="radio"]').attr('checked', 'checked'); });

また、ラジオ ボタンがグループ内にある限り、それに応じて他のボタンをオフにする必要があります。

于 2013-09-04T19:17:29.157 に答える
0

これを試して：

$('.click_radio').on('click change', function(){
    $(this).prev('input[type="radio"]').prop('checked', true);
});

これは、ラジオ入力がクラスを持つ要素の直前.prev()にある限り、必要な数の要素を使用し、機能します。.click_radio

ここで動作しています: http://jsfiddle.net/tv8SR/4/

于 2013-09-04T19:18:42.170 に答える