イベント応答の更新: 要求された場合のみ更新
1. JS HTML DOM または jQuery を通じて HTML 要素を取得し、DOM メソッドまたは jQuery メソッドを通じてページ イベントを監視し、ユーザー リクエストを取得します。
2. Ajax を通じてユーザーリクエストをサーバーに送信し、サーバーは処理後に結果を返し、Ajax がデータを受け取ります。
3. DOM メソッドまたは jQuery メソッドを通じてデータをページにロードすると、イベント応答の更新が完了します。
$('#input_date').keypress(function(e){ if(e.keyCode=='13'){ $.ajax({ type: POST, url: recruit_date.php, data: { Birth:null,/ /1. ユーザーリクエスト (つまり、特定のイベント) を取得し、処理のためにサーバーに送信します。 date:$('#input_date input').val() }、dataType: json、//2 サーバーからデータを取得します。 function(data){ if (data.success) { var Festival = data.fetivalInquireResult;//3. 取得したデータをページにロードして、ページイベント応答の更新を実装します $('#show_festival').text(festival); } else { $('#show_festival').text(フェスティバルの取得に失敗しました) } }、エラー: function(jqXHR){alert(エラーが発生しました: + jqXHR.status); $('#festival').hide(); $('#response_festival').show();
部分的な自動更新: 部分的なページはリクエストなしで自動的に更新されます。
1. setTimeout() などのタイマー関数を使用して、Ajax がサーバーから定期的にデータを取得できるようにします。
2. DOM メソッドまたは jQuery メソッドを通じてデータをページにロードし、ページの部分的な自動更新を実現します。
$(document).ready(function(e){ setTimeout('updateShow()',0);});/*ページデータを部分的に自動更新*/function updateShow(){ $.ajax({ type: GET, url :inquiry_date.php?data= + ask, dataType: json,//1. タイマー成功を通じて定期的にサーバーからデータを取得します: function(data) { if (data.success) { var ageFormat = data.agesFormat; var daysFormat = data.daysFormat;//2. 自動更新を実現するためにデータをページにロードします $('#days').text(daysFormat) ); } else{ アラート(データの取得に失敗しました); } }, エラー: function(jqXHR){ アラート(エラーが発生しました: + jqXHR.status); setTimeout('updateShow()',500);}
以上がこの記事の全内容です。皆様の学習のお役に立てれば幸いです。また、VeVb Wulin Network をご支援いただければ幸いです。