2013-02-25 307 views
1

喜有人可以帮助我这个项目在这里阿贾克斯显示

我有许多问题,如果有人能帮助我这个和一些编码在这里的图像image.php其中有蓝色的图像使用PHP得到的图像名称,说明等,并将图像存储在一个目录中,该PHP只调用该名称..

问题是,当我打电话给页面图像不显示,但来自数据库的数据/字符串显示,但不是图像部分我该如何解决这个问题?

另外我有一个导航,连接到数据库并显示产品列表如何使用ajax在数据库中添加产品id名称,以便我不必添加越来越多的文件只有一个PHP页面显示的产品,它在他们的形象在这里是我用

CSS码

<style> 
    #body{ 
     background-image:url(bg0.png); 
     background-repeat:repeat-x; 
     width:100%; 
     height:100%;    
    } 

    #header{ 
     width:90%; 
     height:150px; 
     background-color:#39F; 
     margin:auto; 
     background-image:url(hd.png); 
     border-radius: 15px; 
     -moz-box-shadow: 3px 3px 4px #000; 
     -webkit-box-shadow: 3px 3px 4px #000; 
     box-shadow: 10px 10px 25px #000; 

    } 

    #himg{  
     border-radius: 0px 0px 0px 15px; 
    } 

    #navi{ 
     float:left; 
     width:20%; 
     height: 500px; 
     margin-left: 74px; 
     margin-top: 10px; 
     border-radius: 100px 0px 100px 0px;  
     overflow:hidden; 
     position:relative; 
     background-color:#456B87; 
     background-image:url(nav1.png);   
     -moz-box-shadow: 3px 3px 4px #000; 
     -webkit-box-shadow: 3px 3px 4px #000; 
     box-shadow: 8px 10px 8px #000; 

    } 

    #navi ol{ 
     clear:left; 
     float:left; 
     list-style:none; 
     margin:0; 
     padding: 0; 
     position:relative; 
     text-align:center; 
     left:50%; 
     vertical-align:middle; 
     display:table-cell; 
    } 

    #navi ol li{ 
     display:block; 
     float:left; 
     list-style:none; 
     margin:0; 
     padding:0; 
     position:relative; 
     right:50%; 
    } 

    #navi ol li details{ 
     border-style:solid; 
     border-radius: 25px 0px 25px 0px; 
     width: 200px; 
     background-color:#FDB735; 
    } 

    #navi ol li details summary::-webkit-details-marker { display:none; } 

    #bod{ 
     background-color:#FFFFFF; 
     float:left; 
     width: 69%; 
     max-width: 69%; 
     margin-left: 9px; 
     margin-top: 10px; 
     height: 500px; 
     max-height: 500px; 
     border-radius: 15px; 
     background-image:url(nav1.png); 
     -moz-box-shadow: 3px 3px 4px #000; 
     -webkit-box-shadow: 3px 3px 4px #000; 
     box-shadow: 10px 10px 15px #000; 
    } 

    #main{ 
     background-color:#FFFFFF; 
     width: 95%;  
     margin-top: 20px; 
     border-radius: 15px;   
     height: 90%;     
    } 

</style> 

AJAX/Javascript代码

编码
<script language="JavaScript" type="text/javascript"> 
    function getXmlHttpRequestObject() { 
     if (window.XMLHttpRequest) { 
      return new XMLHttpRequest(); //Not IE 
     } else if(window.ActiveXObject) { 
      return new ActiveXObject("Microsoft.XMLHTTP"); //IE 
      alert("Your browser doesn't support the XmlHttpRequest object. Better upgrade to Firefox."); 
     } 
    }   
    var receiveReq = getXmlHttpRequestObject();  
    function catia() { 
     if (receiveReq.readyState == 4 || receiveReq.readyState == 0) { 
      receiveReq.open("GET", 'products/product-display-cat.php', true); 
      receiveReq.onreadystatechange = handleCat; 
      receiveReq.send(null); 
     }   
    } 
    function handleCat() { 
     if (receiveReq.readyState == 4) { 
      document.getElementById('main').innerHTML = receiveReq.responseText; 

     } 
    } 
</script> 

结束Java脚本的

HTML代码

<div id='navi'> 
    </br> 
    </br> 
    <ol> 
     <li><details> 
      <summary>Products</summary> 
      <table align='center'> 
       <tr> 
        <td><a href='javascript:cat();'>Catia</a></td> 
       </tr> 

      </table>      
     </details></li> 
    </ol> 
</div> 

HTML代码年底

这是我使用AJAX

调用原始页面代码
<?php 
$result = mysql_query("SELECT * FROM products WHERE ID='6'");     
while($row = mysql_fetch_array($result))      
{echo" 
    <tr><td><img src='image/1361663812.png'></td></tr> 

    <tr><td colspan='2'><img src='image/".$row['Logo']."'></td></tr>   

    <tr><td>Product: ".$row['Product']."</td></tr> 
":} 
?> 

这是原来的网页代码

一些帮助,甚至有点帮助最终将在这里是非常赞赏,并感谢您的时间和精力!很抱歉的JavaScript的我不知道如何正确地表现出来,并再次感谢

+0

图像路径是相对于当前加载的页面的路径吗? – Jon 2013-02-25 03:32:19

+0

你确定你有一个物理副本的图像与您在数据库中检索到的图像名称? – Floricel 2013-02-25 03:41:03

+0

是的图像显示在product.php中,但是当我在索引中使用ajax调用它时,它不显示图像,但它显示从php中的数据库中的字符串或查询,我只添加图像是问题 – user1868185 2013-02-25 05:52:00

回答

1

其确定我得到它,我用一些JavaScript来骗取显示使用该

document.getElementById('img').style.visibility = 'visible'; 
        document.getElementById('img').style.display = 'block'; 
        document.getElementById('img').src='products/image/1361663812.png'; 

阿贾克斯部分

图片后我的路