使用jQuery来更改图像

我有一个表，其他每一行都隐藏起来。当我点击图片时，它会显示隐藏的行并隐藏所有其他行。我可以显示并隐藏行，但出于某种原因，图像不会翻转。使用jQuery来更改图像

<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']?>)">

来源

2013-04-23 MikeSig7

你是什么意思，它不会翻滚？另外，你可以发布标记吗？ – billyonecan 2013-04-23 07:36:34

我更新了代码以显示标记。我使用PHP来生成独特的行和图像ID – MikeSig7 2013-04-23 07:41:11

试试这个，

<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>

来源

2013-04-23 07:41:26 Satpal

将您的其他条件更改为

else { 
      $(this).hide(); 
      $('#img'+id).show(); 
      $('#img'+id).attr("src", "images/toggle_collapse.png"); 
     }

来源

2013-04-23 07:43:20

使用jQuery来更改图像

回答

相关问题