Question

当我点击图片（html标签）时，我想显示一个弹出式面板（例如：当我们点击图片时，就像Facebook中的弹出窗格一样）。注意：弹出窗格应包含图像和文本（从数据库中检索）。

我怎么能这样做？提前你

Answer 1

有些事情如下：

在您的HTML页面中，添加以下代码：

（首先在您的网页上包含Jquery）

当我点击图片（html标签）时，

$('#idOfWhateveriWant').on('click',function(){

});

我想显示一个弹出式面板（例如：当我们点击图片时，就像Facebook中的弹出窗格一样）。

$('#idOfWhateveriWant').on('click',function(){
   //window.open("whatever") 
   //ABOVE NOT RECOMMENDED

   //use below instead

   $.ajax({
   url: 'ajax/test.php',
   success: function(data) {
      $('.result').html(data);
      //or use some jquery plugin you made 
      //or external plugin
      // to make your pane appear
      //$.WHateverPopupPanePlugin(whatever,data)
      alert('Load was performed.');
   }); //SEE http://api.jquery.com/jQuery.ajax/
});

注意：弹出窗格应包含图像和文本（从中检索）数据库）。

IN ajax / test.php：

首先配置mysql数据库，
在其中添加了一些数据
添加一些这样的代码来访问数据库中的内容并将其作为JSON对象回显

以下Php示例：

 <?php 

  //--------------------------------------------------------------------------
  // Example php script for fetching data from mysql database
  //--------------------------------------------------------------------------
  $host = "localhost";
  $user = "root";
  $pass = "root";

  $databaseName = "ajax01";
  $tableName = "variables";

  //--------------------------------------------------------------------------
  // 1) Connect to mysql database
  //--------------------------------------------------------------------------
  include 'DB.php';
  $con = mysql_connect($host,$user,$pass);
  $dbs = mysql_select_db($databaseName, $con);

  //--------------------------------------------------------------------------
  // 2) Query database for data
  //--------------------------------------------------------------------------
  $result = mysql_query("SELECT * FROM $tableName");          //query
  $array = mysql_fetch_row($result);                          //fetch result    

  //--------------------------------------------------------------------------
  // 3) echo result as json 
  //--------------------------------------------------------------------------
  echo json_encode($array);

?>

其他帮助：

用户点击时如何使用弹出窗格创建图像？

1 个答案: