Question

我正在制作一个带有文字幻灯片的项目。我在页面中有一个主div，其中包含每张幻灯片的文本。我将内容保存在数据库中。我想做这个操作：当我单击箭头查看下一张幻灯片时，PHP会从数据库中捕获内容并将其保存在变量中。然后使用JQuery，我用变量替换maindiv的内容。

有可能吗？如果没有，我该怎么办？

Answer 1

使用ajax请求来模拟发布请求，并使用php解析信息。你最终会得到这样的东西：

<?php
if( isset( $_POST["slide"]  ) {
  // Database stuff
  // Echo back 
  echo "Information that you need to get in jQuery";
}
?>
<script>
$("button.next_slide").click(function(){
  var ajax;
  if (window.XMLHttpRequest) {
    ajax = new XMLHttpRequest();
  } else {
    ajax = new ActiveXObject("Microsoft.XMLHTTP");
  }
  ajax.onreadystatechange = function() {
  if (ajax.readyState==4 && ajax.status==200) {
      document.getElementById("some_element").innerHTML = ajax.responseText;
    }
  }
  ajax.open("POST","this_page.php?slide=1&foo=bar&bar=foo",true);
  ajax.send();
});
</script>

<button class="next_slide">Next slide</button>
<div id="some_element"></div>

注意：这可以在没有jQuery或jQuery的$.ajax方法的情况下完成。在此处阅读更多内容：http://api.jquery.com/jquery.ajax/

Answer 2

根据我的理解，当用户点击某个特定按钮然后将其加载到div中时，您希望加载一些数据，我们可以通过jQuery ajax和PHP实现它。

<强> HTML

<div class="main_div">
 <ul id="list"><!-- Our content will load here --></ul>
 <a href="#" class="call_ajax">Next</a>
</div>

<强>的jQuery

jQuery(document).ready(function($){
    $('.call_ajax').on('click', function(e){
          e.preventDefault();
          $.post('ajax.php', { get_slide: true }, function(response){
               // We are telling jQuery to parse response as json because in ajax.php we have used json_encode function. 
                var data = jQuery.parseJSON(response);
                $("#list").append('<li>' + data['slide'] + '</li>');   
          });  
    })
})

PHP ajax.php

if(isset($_POST['get_slide'])){
  //Get slide from db and output it as json, but currently for example purpose we assume that we have a array.

   $data['slide'] = 'Your slide text';
   echo json_encode($data); die(); // We have used die because we don't won't our script to run any more.
}

我没有测试过它，但它会起作用。

组合JQuery和PHP

2 个答案: