沃梦达 / IT编程 / 前端开发 / 正文

使用php jquery ajax从mysql获取图像并在DIV中的html页面中显示它们

我正在编辑我的问题后深入搜索我的问题基本上我的网站是一个时装展示网站,它显示鞋布和包等现在很明显,我将有很多的照片,我用jquery和javascript解决我的问题,当一个用户单击索引页面上的缩略图,或者他转到菜单并单击...

我正在编辑我的问题后深入搜索我的问题基本上我的网站是一个时装展示网站,它显示鞋布和包等现在很明显,我将有很多的照片,我用jquery和javascript解决我的问题,当一个用户单击索引页面上的缩略图,或者他转到菜单并单击鞋子链接javascript在新选项卡中打开较大的图像但现在我开始浏览php我在下面做了什么

>我创建了一个mysql数据库,其中包含图像路径,如图像/ zara /缩略图/鞋子,用于缩略图和图像/ zara /鞋子,用于较大的图像
>当用户点击ex(鞋子)的链接时,链接文本将被这样的jquery抓取

   $(document).ready(function() {
    $('ul.sub_menu a').click(function() {
        var txt = $(this).text();  
            $.ajax({
            type: 'POST',
            url: 'thegamer.php',
            data: {'txt'}
            });
    });
});

进一步将它传递给php文件现在我在这里遇到问题我现在需要的是

that how will php make search on the basis of that var txt in the database retrieve the thumbnails of the shoes open a new tab say(shoes.html) and display all the available shoes thuumbnails in divs

解决方法:

CSS:

#imagePopup{ float:left; z-index:10; position: absolute;} 

添加一些定位

HTML:
     
     

<div id="prodtwoid" class="prodcls">
<img src="images/thumbnail/zara/2.png" alt="ZARA"/>
</div>

<div id="prodthreeid" class="prodcls">
<img src="images/thumbnail/puma/1.png" alt="PUMA"/>
</div>

<div id="prodfourid" class="prodcls">
<img src="images/thumbnail/hermes/1.png" alt="HERMES"/>
</div>
//This is you popup div
<div id='imagePopup' style='display:none'>
</div>

JS:

$('.prodcls').click(function(){
   var src = $(this).attr('src').replace('/thumbnail', '');
    $("#imagePopup").html("<img src='"+src+"'/>")
    $("#imagePopup").toggle();
});

更新的答案:

HTML :(为每个图片提供链接):

<a href='showImage.php?img=path/of/image.jpg'><img src='path/of/thumb.jpg'/></a>

showImage.php:

$sImagePath = $_GET['img'];
echo "<div class='imgDiv'>";
echo "<img src='$sImagePath' />";
echo "</div>;

本文标题为:使用php jquery ajax从mysql获取图像并在DIV中的html页面中显示它们