ページの読み込み時にajaxを呼び出し、データを更新するには

Question

ページが読み込まれたらデータを読み込み、必要なときにデータを更新するためのボタンをクリックできるようにしようとしています。今すぐボタンをクリックするだけで動作します。ここに私が持っているもののサンプルがあります。

jQueryの/ AJAX呼び出し：

 $(document).ready(function() { 

     $("#update").click(function(e) { 
     e.preventDefault(); 

     $.ajax({ 
      url: "mycode", 
     dataType: "json", 
      data: { 
       //id: $(this).val(), 
      }, 
      success: function(result) { 

      alert(JSON.stringify(result)); 

      }, 
      error: function(result) { 
      console.log(result); 
      } 

     }); 
     }); 


    }); 

HTML：探しのための

 <a id="update" href="#" class="button">Update Data</a> 

    <div id="container"> 

     <div id="mydata"></div> 

    </div> 

ありがとう！

$("#update").click(function(e) { 
    e.preventDefault(); 
    // ajax logic here... 
}).click(); // < raise event on load 

はまた、あなたが両方の場所に呼び出される関数へのAJAXロジックを抽出することができます：

Answer 1

は、あなたがあるとして、あなたのコードを残して、ちょうど負荷に clickイベントを発生させることができますどちらかこれを達成するために

Answer 2

.readyスコープにAJAXコールを入れる必要があります。現在、click機能によってブロックされています。ここで

$(document).ready(function() { 

    updatePage(); 

    $("#update").click(function(e) { 
    e.preventDefault(); 

    updatePage(); 
    }); 


}); 

function updatePage(){ 
    $.ajax({ 
     url: "mycode", 
    dataType: "json", 
     data: { 
      //id: $(this).val(), 
     }, 
     success: function(result) { 

     alert(JSON.stringify(result)); 

     }, 
     error: function(result) { 
     console.log(result); 
     } 

    }); 
} 

Answer 3

あなたが行く：

$(document).ready(function() { 
 
    $("#update").click(function(e) { 
 
     e.preventDefault(); 
 
     loadData(); 
 
     } 
 
     loadData(); 
 
    }); 
 

 
    function loadData() { 
 
    $.ajax({ 
 
     url: "mycode", 
 
     dataType: "json", 
 
     data: { 
 
      //id: $(this).val(), 
 
     }, 
 
     success: function(result) { 
 

 
      alert(JSON.stringify(result)); 
 

 
     }, 
 
     error: function(result) { 
 
      console.log(result); 
 

 
     }); 
 
    }); 
 

 
}

<a id="update" href="#" class="button">Update Data</a> 
 

 
<div id="container"> 
 
    <div id="mydata"></div> 
 
</div>