有人點擊圖片時如何獲取圖片預覽？

-1

<script language="javascript" type="text/javascript"> 
function SetImageName(strName) 
{ 
document.getElementById("ImageName").value = strName; 
} 
</script> 

<form> 
<div id="slideshow"> 
<div id="Container"> 
<div id="Images"> 
      <img src="images/image1.jpg" name="image1.jpg" onclick="SetImageName(this.name)"/> 
      <img src="images/image2.jpg" name="image2.jpg" onclick="SetImageName(this.name)"/> 
      <img src="images/image3.jpg" name="image3.jpg" onclick="SetImageName(this.name)"/> 
      <img src="images/image4.jpg" name="image4.jpg" onclick="SetImageName(this.name)"/> 
      <img src="images/image5.jpg" name="image5.jpg" onclick="SetImageName(this.name)"/> 
      <div id="slideEnd"></div> 
      </div> 
     </div> 
    </div> 
     <input type="hidden" value="" id="ImageName" name="ImageName"/></form>

用戶可以從列表中選擇一個圖像。想要獲取圖像的預覽選擇哪個用戶。像

You are selected image is 
<? 
$image = $_POST["ImageName"]; 
echo ('<img src="'.$image.'" />'); 
?>

來源

2013-03-22 Sudha Sarath

我想你想列出圖像（只有圖像的名稱）。對？然後，當有人點擊它顯示該圖像。對？請給予回覆。 – Napster 2013-03-22 09:49:39

是Nisarg Patel ... – 2013-03-22 09:51:11

okey等了五分鐘。我有解決方案。 – Napster 2013-03-22 09:51:49

請嘗試以下方法：

<html> 
<head> 
<title>sample</title> 

<style type="text/css"> 
.hover_image a{ 
position:relative; 
} 
.hover_image a span{ 
position:absolute; 
display:none; 
z-index:99; 
} 
.hover_image a:hover span{ 
display:block; 
} 
</style> 
</head> 
<body> 
<div class="hover_image"> 
<a href="#">Links text <span><img src="image.png" alt="image" height="100" /></span></a> 
</div> 
</body> 
</html>

放入相對目錄的任何圖像名image.png和懸停在網頁上的文字看圖像。

你可以編輯這個以適應你的需要。

來源

2013-03-22 09:58:41

否否有一些圖像。用戶可以選擇圖像。如果有人選擇圖像，則想顯示圖像，例如「您被選中此圖像」。 – 2013-03-22 10:40:45

這將爲你工作..使用它。我用jQuery進行這個練習。

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script> 
    $(document).ready(function() 
    { 
     $('div').click(function() { 
      var image = $(this).text(); 
      $("#showImage").html("<img src='your_path/"+image+".png'>"); 
      // do something with the text 
     }); 
    }); 
</script> 
<div id="image1" >Image1</div> 
<div id="image2" >Image2</div> 
<div id="image3" >Image3</div> 
<div id="image4" >Image4</div> 

<div id="showImage"></div>

來源

2013-03-22 10:11:35 Napster

否否有一些圖像。用戶可以選擇圖像。如果有人選擇圖像，則想顯示圖像，例如「您被選中此圖像」。不是圖像名稱。圖像本身想顯示... – 2013-03-22 10:41:04

我貼的代碼... – 2013-03-22 10:46:10

歐凱那麼你可以這樣做：

添加在您的代碼： - title屬性添加到每個img標籤，去掉name屬性
給值title屬性要展示在點擊事件

現在添加以下代碼

<script> 
$(document).ready(function() 
{ 
    $('img').click(function(){ 
     var nameImg = $(this).attr('title'); 
     alert("you have selected "+nameImg); 
    }); 
});

如果你想顯示在其他分區這個名字再加入一個DIV ID爲「selectedImgTag」以及與此代碼替換上面的代碼這個代碼將提醒形象的名字 -

<script> 
     $(document).ready(function() 
     { 
      $('img').click(function(){ 
       var nameImg = $(this).attr('title'); 
       $("$selectedImgTag").html("you have selected "+nameImg); 
      }); 
     }); 
    </script>

來源

2013-03-22 11:28:15 Napster

有人點擊圖片時如何獲取圖片預覽？

回答

相關問題