jquery load method code example

Example 1: jQuery - AJAX load() Method

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("#div1").load("demo_test.txt");
  });
});
</script>
</head>
<body>

<div id="div1"><h2>Let jQuery AJAX Change This Text</h2></div>

<button>Get External Content</button>

</body>
</html>

Example 2: jquery La méthode .load()

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
   
  <title>jQuery demo ajax post et ajax get </title>
<script type="text/javascript" src=
  "http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js">
  </script>
<script>
$(document).ready(function(){
 
  $("input").keyup(function(){
   
  txt=$("input").val();
   
  $("span").load("demo_ajax_post.php",{suggest:txt});
 
  });
});
</script>
</head>
<body>
<p>Commencer
  à saisir le nom d'un animal dans la zone de texte suivante:</p>
Nom
  d'animal : <input type="text"/>
<p>Suggestions :
  <span></span></p>
<p>le
  fichier  "demo_ajax_load.php"
  utilisé dans cet exemple se trouve ici: (<a href="demo_ajax_post.txt"
  target="_blank">demo_ajax_load</a>) </p>
</body>
</html>

Example 3: jquery La méthode .load()

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
   
  <title>jQuery demo ajax load</title>
<script type="text/javascript" src=
  "http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js">
  </script>
<script>
$(document).ready(function(){
 
  $("button").click(function(){
   
  $("div").load("livres.xml",function(response,status){
     if (status=="success")
     {
     $("div").html("<ol></ol>");
    
  $(response).find("titre").each(function(){
       var txt1 =
  $(this).text();
 var txt2 = $(response).find("lien").text();
 var text = '<a href="'+txt2+'"
  target="_blank">'+txt1+'</a>'
       $('<li></li>').html(text).appendTo('ol');
       });
     alert("Il y a 
  "+$(response).find("titre").size()+"
  livres.\n Cliquez  sur le nom du livre
  pour voir l'offre le concernant.") 
     }
   
  });
 
  });
});
</script>
</head>
<body>
<h2>Des livres</h2>
<div></div>
<button>Execute</button>
<p><b>le
  fichier xml utilisé pour cet exemple est ici <a href="livres.xml" target="_blank">livres</a></b></p>
</body>
</html>

Tags:

Html Example

Recent Posts