如何在单击另一个页面按钮时加载单页内容而不刷新页面

问题描述：

I have two pages (checkout and order page).
The checkout page contains a confirme order button. If the button is clicked the order page loads the data without a page refresh.

How can i do that. Please click me.

我有两个页面（ checkout em>和 order em>页面）。 结帐 em>页面包含确认订单 code>按钮。如果单击该按钮， order em>页面将加载数据而不刷新页面。 p>

我该怎么做。请点击我。 p> div>

答

You can use an ajax call to get HTML from 'data.php' (or wherever you are getting your data from) and print that HTML into a div in checkout page.

$.ajax({
  url: "data.php"
}).complete(function(result) {
  $( div ).html(result);
});

Something similar to this.

For more on Ajax - http://api.jquery.com/jquery.ajax/

答

First take a simple button and call a jquery function onclick-

 echo '<a href="#" id="button">Click to change</a>';

Jquery

<script type="text/javascript">

$(function() { // wrap inside the jquery ready() function

//Attach an onclick handler 

$('#button').click(function(){

//Get the ID of the button that was clicked on (addition if you want any specific data, just pass that id in place of button)
var specific_id = $(this).attr("id");


$.ajax({
  url: "yourPHP_data.php", //This is the page where you will handle your SQL insert
  type: "POST",
  data: "data=" + specific_id, //The data your sending to yourPHP_data.php
  success: function(){
      console.log("AJAX request was successfull");
  },
  error:function(){
      console.log("AJAX request was a failure");
  }   
});

});

});
</script>

yourPHP_data.php page contain your code that you want to load and display, and you also find that data you have passed-

$data = $_POST['data'];

如何在单击另一个页面按钮时加载单页内容而不刷新页面

相关推荐