web-dev-qa-db-ja.com

単一要素でのjquery on（）ロードイベント

この質問がすでに聞かれている場合は申し訳ありませんが、解決策が見つかりませんでした。

3つのラジオ要素があり、選択が変更されたときとページが読み込まれたときに値を確認したい。

On（）関数のみを使用してそれを行います。

私の問題は、変更イベントのみがトリガーされることです。

ここに私の現在のコードがあります：

$('.user').on('load change', function(){
  if($(this).val() == 'client'){ 
$('#user_parent').removeAttr('disabled').closest('tr').show(200);
}else{
  $('#user_parent').attr('disabled', 'disabled').closest('tr').hide(200);
}
});"

また、ロードを準備完了に置き換えようとしましたが、失敗しました。何の問題？ loadイベントは単一の要素で利用できませんか？

コードは$（document）.ready（...）に配置され、ページが送信されるときに要素がすべて表示されます。

ありがとう

jqueryeventsload
17
FLX

loadイベントは、リッスンされた要素のすべての子要素が読み込まれたときに呼び出されます。あなたの場合、これはreadyイベントが呼び出される前である可能性があり、そのためハンドラーをロードするようにレンダリングします（document.readyの後に追加されます）。

参照用に JQuery api を参照してください。次の場所にあります。

Loadイベントは、要素とすべてのサブ要素が完全にロードされると、要素に送信されます。このイベントは、URLに関連付けられた任意の要素（画像、スクリプト、フレーム、iframe、ウィンドウオブジェクト）に送信できます。

これは、URLが必要なことも意味するため、loadイベントをリッスンできます。あなたはそれ以上のコードを提供していないので、私はあなたが実際に聞くことができるURLを持っていると仮定します。

これが最も可能性の高い原因かもしれません。 関連付けられたURLがない場合（少なくとも1つの）子要素はありませんロードイベントを聞くことができます。

代わりにこれを試してください：

$(document).ready(function(){
   checkUserVal();
   $('.user').on('change', checkUserVal);
});

var checkUserVal = function(){
  //do the check
  if($('.user').val() == 'client'){ 
     $('#user_parent').removeAttr('disabled').closest('tr').show(200);
  }else{
     $('#user_parent').attr('disabled', 'disabled').closest('tr').hide(200);
  }
};

私はコードを読みやすさを向上させる方法にしました;）

20
Vogel612

Vogel612の説明 のように、ほとんどの要素でloadは起動しません。

readyはdocument専用です。

eachを使用して、最初にイベントハンドラーを実行できます。

$(document).ready(function(){
  $('.user')
    .each(user_handler)
    .on('change', user_handler);
});

var user_handler = function(){
  // this
};
5
Vezquex