<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script language="javascript" src="jquery-1.2.6.min.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function(){
//进入后将checkbox全部设为未选中,防止刷新后还有选中的现象
$('.photoBox .imageover .photoCheck').attr("checked",false);
$('.photoBox').mouseover(function(){
$(this).children('.imagestate').hide();
$(this).children('.imageover').show();
$(this).children('.imagevisited').hide();
});
$('.photoBox').mouseout(function(){
if($(this).children().children('.photoCheck').attr('checked')==true){
$(this).children('.imageover').hide();
$(this).children('.imagestate').hide();
$(this).children('.imagevisited').show();
}else{
$(this).children('.imageover').hide();
$(this).children('.imagestate').show();
$(this).children('.imagevisited').hide();
}
});
});
var clickMe=-1;
//防止事件冒泡
function setClickMe(){
// $(".photoBox .imageover .photoCheck").attr("clickMe","1");
clickMe=1;
}
//打开浏览图片页
function viewPhoto(url){
//var clickMe=$(".photoBox .imageover .photoCheck").attr("clickMe");
//alert(clickMe);
if(clickMe==undefined || clickMe==-1){
alert(url);
//location.href = url;
}else{
clickMe=-1;
// $(".photoBox .imageover .photoCheck").attr("clickMe","-1");
}
}
//取选中图片的ID
function getPhotoIds(){
var ids="";
$('.photoBox').children('.imagevisited').each(function(){
if($(this).css("display")=="block"){
if(ids!=="")
ids=ids+","+$(this).children('.photoImg').attr('photoId');
else
ids=ids+$(this).children('.photoImg').attr('photoId');
}
});
alert(ids);
}
</script>
</head>
<body>
<!--
<div class="imagestate"><a href="#"><img src="1.gif" width="80" height="80" border="0" /></a></div>
<div class="imageover"><input type="checkbox" name="checkbox" id="checkbox" /></div>
<div class="imagevisited"><img src="visited.gif" width="15" height="15" /></div>
-->
<div class="photoBox">
<div class="imagestate" style="float:left; height:80px; width:80px; cursor:pointer;">
<img src="1.gif" width="80" height="80" border="0" />
</div>
<div class="imageover" οnclick="viewPhoto('http://www.baidu.com');" style="display:none; background:url(1.gif) no-repeat; float:left; height:80px; width:80px; text-align:left; cursor:pointer;">
<input οnclick="setClickMe();" class="photoCheck" type="checkbox" name="checkbox" />
</div>
<div class="imagevisited" style="display:none; background:url(1.gif) no-repeat; float:left; height:80px; width:80px; text-align:left; cursor:pointer;">
<img class="photoImg" src="visited.gif" width="15" height="15" photoId="1001" />
</div>
</div>
<div class="photoBox">
<div class="imagestate" style="float:left; height:80px; width:80px; cursor:pointer;">
<img src="1.gif" width="80" height="80" border="0" />
</div>
<div class="imageover" οnclick="viewPhoto('http://www.baidu.com');" style="display:none; background:url(1.gif) no-repeat; float:left; height:80px; width:80px; text-align:left; cursor:pointer;">
<input οnclick="setClickMe();" class="photoCheck" type="checkbox" name="checkbox" />
</div>
<div class="imagevisited" style="display:none; background:url(1.gif) no-repeat; float:left; height:80px; width:80px; text-align:left; cursor:pointer;">
<img class="photoImg" src="visited.gif" width="15" height="15" photoId="1002" />
</div>
</div>
<div class="photoBox">
<div class="imagestate" style="float:left; height:80px; width:80px; cursor:pointer;">
<img src="1.gif" width="80" height="80" border="0" />
</div>
<div class="imageover" οnclick="viewPhoto('http://www.baidu.com');" style="display:none; background:url(1.gif) no-repeat; float:left; height:80px; width:80px; text-align:left; cursor:pointer;">
<input οnclick="setClickMe();" class="photoCheck" type="checkbox" name="checkbox" />
</div>
<div class="imagevisited" style="display:none; background:url(1.gif) no-repeat; float:left; height:80px; width:80px; text-align:left; cursor:pointer;">
<img class="photoImg" src="visited.gif" width="15" height="15" photoId="1003" />
</div>
</div>
<div οnclick="getPhotoIds();">显示选中的图片ID</div>
</body>
</html>
2178
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
