我有一张表,其中每一行都被隐藏。单击图像时,它将显示隐藏的行并隐藏所有其他行。我可以显示和隐藏行,但由于某种原因,图像不会翻转。
<script type="text/javascript">
function toggleByID(id) {
$('.data-row-hidden').each(function(index) {
if ($(this).attr("id") == "row"+id) {
$(this).toggle(500);
$('#img'+id).attr("src", "images/toggle_expand.png");
}
else {
$(this).hide();
$('#img'+id).attr("src", "images/toggle_collapse.png");
}
});
}
</script>
以下是我用于隐藏行的代码:
<tr id="<?='row'.$value['property_id']?>" class="data-row-hidden">
以下是我用来调用函数的代码:
<img id="<?='img'.$value['property_id']?>" src="images/toggle_collapse.png" border="0" height="20" width="20" onclick="javascript:toggleByID(<?=$value['property_id']?>)">
答案 0 :(得分:2)
试试这个,
<script type="text/javascript">
function toggleByID(id) {
$('.data-row-hidden').each(function(index) {
var newImage = new Image();
if ($(this).attr("id") == "row"+id) {
$(this).toggle(500);
newImage.src = "images/toggle_expand.png";
}
else {
$(this).hide();
newImage.src = "images/toggle_collapse.png";
}
//cache busting
newImage.src = newImage.src + "&_=" + new Date().getTime();
$('#img'+id).attr("src", newImage.src);
});
}
</script>
答案 1 :(得分:1)
将您的其他条件更改为
else {
$(this).hide();
$('#img'+id).show();
$('#img'+id).attr("src", "images/toggle_collapse.png");
}