Как загрузить страницу PHP в div с помощью jQuery и AJAX?

Я пытаюсь написать функцию, которая будет вызывать getproduct.php?id=xxx при нажатии. Я могу получить часть innerHTML , но как я могу также назвать php страницу, которая фактически выполняет эту работу?

 var id = id; document.getElementById("digital_download").innerHTML = "Downloading...Please be patient. The process can take a few minutes."; url = getproduct.php?id=id; 

Вы можете сделать это с помощью jQuery, например.

 var id = 1; $('#digital_download').html('Downloading...'); // Show "Downloading..." // Do an ajax request $.ajax({ url: "getproduct.php?id="+id }).done(function(data) { // data what is sent back by the php page $('#digital_download').html(data); // display data }); 

вы можете вызвать или загрузить php-страницу внутри div, используя эту строку:

 $("#content_div").load("ajax/page_url.php"); 

«ajax / page_url.php» – это относительный путь к файлу php.

поэтому здесь вы также можете заменить его внешним URL-адресом.

пожалуйста, поделитесь с вами знаниями, если я ошибаюсь.

Изменить: исходный вопрос не ссылался на jQuery. Оставляя этот ответ здесь, поскольку другие могут найти это полезным.

Вот как вы это сделаете, используя объект XHR для запроса ajax без jQuery или Prototype или другой библиотеки JS.

 var xmlhttp; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { document.getElementById('digital_download').innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET", 'getproduct.php?id=' + id,true); xmlhttp.send(); } 

Существует множество способов, которыми вы можете загрузить страницу в раздел.

Сам метод

 var xmlhttp; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { document.getElementById('digital_download').innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET", 'getproduct.php?id=' + id,true); xmlhttp.send(); } 

это типичный метод без внешней ссылки.

Если вы идете со ссылкой, есть 5 способов сделать ajax-вызов с помощью jQuery


  • load (): загрузить часть html в DOM контейнера.
  • jQuery.getJSON (): Загрузите JSON с помощью метода GET.
  • jQuery.getScript (): загрузить JavaScript.
  • jQuery.get (): Используйте это, если вы хотите сделать GET-вызов и активно играть с ответом.
  • jQuery.post (): используйте это, если вы хотите сделать POST-вызов и не хотите загружать ответ на какой-либо контейнер DOM.
  • jQuery.ajax (): используйте это, если вам нужно что-то сделать, когда XHR завершится с ошибкой, или вам нужно указать параметры ajax (например, cache: true) на лету.

Вы можете использовать запрос на получение или отправку, используя запрос

 $.ajax({ type: "POST", url: url, data: data, success: success, dataType: dataType }); 

пример

Привет. Вы можете вызвать функцию ниже, чтобы выполнить это, она загружает данные с сервера на успех, вы также можете создать функцию сбоя

  function setValue(Id) { document.getElementById("digital_download").innerHTML = "Downloading...Please be patient. The process can take a few minutes."; var data1 = { message: Id, }; $.ajax({ data: data1, type: 'GET', url: "http://urltoscript/index.php", cache: false, dataType: "json", crossDomain: true, success: function(data) { console.log("Response for cancel is: " + data); document.getElementById("digital_download").innerHTML = data } }); }