显示图像onclick里面的PHP

我试图用php显示一个文件夹中的所有文件，并在每个图像旁边放置一个单选按钮。当选择一个单选按钮时，我想重新显示页面某处的图像。最终目标是拥有三个图像集合，用户可以选择三个图像并将它们一起看作三联体。显示图像onclick里面的PHP

我知道我必须实现一些onclick代码，但我不知道如何去做。

我的代码：

<?php 


$dir = "image_gallery/"; 

//open dir 
if ($opendir = opendir($dir)) 
{ 
//read dir 
while (($file = readdir ($opendir)) !==FALSE) 
{ 
    if ($file!="."&&$file!=".."&&$file!="DS_Store") 
    echo "<img src='$dir/$file' width='200'><input type='radio' value='$file' name='filename'><br>"; 
    //echo "<input type='radio' value='yes' name='$file' />"; 

} 

} 

?> 
<input type="submit" name="submit" value="That's Right!"> 

</form> 
</body> 
</html>

我希望能够显示$ file变量的onclick，而不是阅读完所有的图像源到一个数组并在该数组的第n个条目调用。

我很欣赏任何输入。

也对工作代码的链接，http://www.evan-livingston.com/test/list.php

EDIT

非功能的代码;

<html> 
<head> 
<script type="text/javascript"> 
function listSelectedImages() { 
    var selected = $('input[type=radio]:checked'), 
     selection = $.map(selected, function(e){ 
      return e.value; 
     }); 
    $('#selection').text(selection.join(', ')); 
} 

$('input[type=radio]').change(listSelectedImages); 
</script> 
</head> 
<body> 
<form action="bad_words.php" method=post> 
    <a href="../main.page.php">back to main page</a> 
    <br/> 
    <br/> 

    <img src='image_gallery//11.01.29.3-13.jpg' width='200'> 
    <input type='radio' value='11.01.29.3-13.jpg' name='filename'> 

    <br> 
    <img src='image_gallery//11.01.29.3-3.jpg' width='200'> 
    <input type='radio' value='11.01.29.3-3.jpg' name='filename'> 

    <br> 
    <input type="submit" name="submit" value="That's Right!"> 

</form> 
<div id="selection"></div> 
</body> 
</html>

来源

2011-05-29 evanlivingston

与php无关，这将不得不做的客户端 – 2011-05-29 06:45:18

我不知道这是什么意思 – evanlivingston 2011-05-29 06:57:53

你是摄影师？三联是一个相当深奥的术语...：D – 2011-05-29 19:20:35

@Dagon手段（在评论你的问题），你必须处理的图像中（使用JavaScript）的浏览器通过选择（其他城市）触发的事件，而不是在服务器上（使用PHP）。

据我所知，你想列出所选单选按钮values列表旁边的某处？下面是使用jQuery一个简单的例子，这是否让你开始：

function listSelectedImages() { 
    var selected = $('input[type=radio]:checked'), 
     selection = $.map(selected, function(e){ 
      return e.value; 
     }); 
    $('#selection').text(selection.join(', ')); 
} 
// This will ensure that the inputs you're trying to access 
// are actually loaded onto the page already 
$(function(){ 
    $('input[type=radio]').change(listSelectedImages); 
});

工作例如：http://jsfiddle.net/dXUYb/

UPDATE

为了显示图像而不是文件名列表，你可以例如做这样的事情：

function listSelectedImages() { 
    $('input[type=radio]:checked') 
     .prev('img') 
     .clone() 
     .insertAfter('#selection'); 
} 

$('input[type=radio]').change(listSelectedImages);

我会推荐给包裹的图像，并输入在<label>标签允许单击图像本身以及过于选择它。这里有一个更新的例子：http://jsfiddle.net/dXUYb/5/

来源

2011-05-29 07:37:31 polarblau

我为我的生活无法得到这个工作，我编辑了上面的帖子来显示我的完整代码。 – evanlivingston 2011-05-29 19:16:38

如果您包含代码，则需要在DOM已加载（请参阅上面的更新）后附加'change'监听器。你是否需要上面的jQuery？我看不到它？ – polarblau 2011-05-29 19:26:36

我确实得到它的工作，非常感谢。我想让它实际显示图像，你能指出我的方向吗？ – evanlivingston 2011-05-30 03:24:03

显示图像onclick里面的PHP

回答

相关问题