Главная  /  jQuery  /  Ajax  /

Метод jQuery ajax

    Метод jQuery $.ajax() используется для выполнения AJAX (асинхронного) HTTP-запроса
$ .ajax (имя: параметры значения)

    Пример 1
    
В примере загружается текстовый файл с помощью метода jQuery $ .ajax, размещенного в том же каталоге, что и исходный файл, который его вызывает. 
После загрузки при нажатии кнопки будут отображаться загруженные данные из текстового файла в ajaxrequest Div.

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
$(document).ready(function(){
$("#loaddata").click(function(){ 
$.ajax({url:"ajax/ajaxexample.php",success:function(ajaxresult){
$("#ajaxrequest").html(ajaxresult);
}});
});
});
</script>
<div>Нажмите кнопку, чтобы загрузить данные, возвращенные AJAX</div>
<button id="loaddata">Загрузить данные для ajaxrequest Div</button>
<div id="ajaxrequest"></div>

    Нажмите кнопку, чтобы загрузить данные, возвращенные AJAX
    


    

    Пример 2
    
В приведенном ниже примере мы будем использовать данные, введенные в текстовое поле. Введенный текст в полях имени и местоположения будет назначен переменным в jQuery. 
После нажатия кнопки метод jQuery $ .ajax () вызовет файл URL = post_test.php . Он получит отправленные параметры, имя, местоположение и возвращаемую строку вывода. 
Все будет сделано без перезагрузки веб-страницы.
Примечание. Файл Post_test.php находится в том же месте, что и наш HTML-файл, в котором используется метод ajax.
Если вызов AJAX успешен, функция обратного вызова отобразит возвращенные данные в Div

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
$(document).ready(function(){
$("#loaddata").click(function(){
txtname=$("#txtinput").val();
txtlocation=$("#txtlocation").val();
$.ajax({url:"ajax/post_test.php",data:{name:txtname, location: txtlocation },success: function(ajaxresult){
$("#ajaxrequest").html(ajaxresult);
}});
});
});
</script><div id="ajaxrequest"></div>
Введите имя: <input type="text" id="txtinput"><br />
Введите местоположение <input type="text" id="txtlocation"><br />
<button id="loaddata">Нажмите, чтобы отправить запрос на post_test.php</button>


    Введите имя: 
    
Введите местоположение