-1

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

我怎么能那样做？提前谢谢你

4

1 回答 1

2

类似这样的东西：

在您的 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/
});

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

在 ajax/test.php 中：

  1. 首先配置mysql数据库，
  2. 在里面放一些数据
  3. 添加一些这样的代码来访问数据库中的内容并将其作为 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);

?>

附加帮助：

于 2012-09-09T16:57:59.187 回答