2

我想达到什么 我有一些我想展示的作品。所以，我有这些的缩略图。当访问者点击缩略图时，我想要一个 div（称为 slickbox）打开并显示标题、描述和关于所点击作品的滑块。

我已经完成了什么以及如何 从数据库中获取我的工作数据。这是我的作品清单的一小部分：

索引.php

<?php
  $retour_messages = mysql_query('SELECT 2K13_works.*, 2K13_categories.nom AS nomCAT FROM 2K13_works, 2K13_categories WHERE 2K13_works.cat_id = 2K13_categories.cat_id ORDER BY 2K13_works.record_date DESC') or die(mysql_error());//requete sql pour récupérer les works de la page
  ?>
  <ul id = "creations" class = "step">
    <?php
  while($donnees_messages=mysql_fetch_assoc($retour_messages)){
  echo '<li class = "step '.$donnees_messages['nomCAT'].'" id="'.$donnees_messages['work_id'].'">
               <div class = "item"><a href = "#"><img src = "'.$donnees_messages['thumbLink'].'" alt = "'.$donnees_messages['titre'].'" title = "" width = "226" height = "147"/></a>
                <div class = "caption">
                  <h3>'.$donnees_messages['titre'].'</h3>
                  <p>'.html_entity_decode($donnees_messages['resume'],ENT_QUOTES,'UTF-8').'</p>
                  <p id = "desc" class = "hidden">'.html_entity_decode($donnees_messages['description'],ENT_QUOTES,'UTF-8').'</p>
                  <!--<p id = "idw" class = "hidden">'.$donnees_messages['work_id'].'</p>-->
                </div>
              </div>
            </li>';
            }
 ?>
  </ul>

如您所见，我有一个 ul 标签，其中包含每个作品的 li 标签。每个 li 标签获取数据库中作品的 id，每个 li 包含 h3 标签和 p 标签，其中包含我想在 slickbox 中显示的文本（对于图像，我稍后会看到）。

现在，我的 slickbox 的 JavaScript 代码出现和消失：

front_functions.js

//_____________SLICKBOX__________________________________
$('#slickbox').hide();
$("#creations li").click(function(e) {
    // shows the slickbox on clicking the noted link
    $titre = $(e.target).children("h3").text();
    $bla = $(e.target).children("#hidden").text();
    $("#description").children("h1").text($titre) ;
    $("#description").children("p").text($bla); 
      $('#slickbox').slideDown();
      e.preventDefault();
      $(e.target).empty();
      //return false;
});

此代码不起作用，因为我的 slickbox 是在工作之前加载的。这就是为什么我需要 Ajax 和异步发送和执行请求的方式。

我在这里阅读了这个示例代码：这很有帮助。但是，我有一个问题：我正在使用 jQuery，我想使用$.ajax(). 而且我真的不明白如何做到这一点。

我必须设置一个 XHMLHTTPRequest 对象吗？我在哪里可以编写 Ajax 调用？我可以调用函数而不是 URL 吗？

喜欢做（我不知道）：

$(#creations li).click(function(e){
        $.ajax(){
           function : "displayContent(id,desc,title)",
        }
}
function displayContent(id,desc,title){
    $(#slickBox).children("h1").innerHTML(title);
    $(#slickBox).children("p").innerHTML(desc);
    $(#slickBox).show();
}

我什至不知道我是否应该使用 JSON（但是，因为我的数据已经存储，我只想显示它们，我想我不需要 Json）。

请给我您的知情意见和您的资深建议。

4

1 回答 1

4

当您发送对服务器的请求（使用 ajax）时，这就像您在页面中提交表单一样。
所以当你提交表单时，你可以用 php 做的每一件事，你也可以用 ajax 来做。
例如，如果你想用 ajax 在 php 中调用一个函数，只需像这样向 php 发送一个参数： 

$.ajax({  
  type:'POST',
  data:{
     param:'Hey_php_call_this_function' 
  },
  success:function(data){
     alert('hey jquery , php said : ' + data);
  }
});

在服务器端： 

if(isset($_POST['param']) && $_POST['param'] == 'Hey_php_call_this_function'){
    echo call_a_function();  /// "output to callback success function"  = data
}

希望有帮助。

于 2013-03-06T17:11:52.773 回答