如何使用jQuery更改项目的可见性？

我的应用程序要求用户上传一组必需的文档（上传＃1，上传＃2，上传＃3）。 上载完成后，将返回需求标识符（req_id）。

该页面显示要求列表，并且当上传特定项目时，当前将该类从“缺失”更改为“完成”。 但是，我也想在上传完成后将“删除”图标的可见性从隐藏更改为可见。

HTML：

 
  Upload #1   <img src="http://sofzh.miximages.com/jquery/download.png" class="download"  > <img src="http://sofzh.miximages.com/jquery/trash.png" class="delete"  >  
 
  Upload #2   <img src="http://sofzh.miximages.com/jquery/download.png" class="download"  > <img src="http://sofzh.miximages.com/jquery/trash.png" class="delete"  >  
 
  Upload #3   <img src="http://sofzh.miximages.com/jquery/download.png" class="download"  > <img src="http://sofzh.miximages.com/jquery/trash.png" class="delete"  >  
  

使用Javascript：

 function stopUpload(success, req_id){ if (success == 1){ $('#upload_result').html('Success!'); $("ul li[rel=" + req_id + "]").removeClass().addClass('complete') $("ul li[rel=" + req_id + "]").child('.controls').child('.delete').css('visibility','visible') } else { $('#upload_result', window.parent.document).html( 'Error!'); } $('#upload_progress').hide(); return true; } 

Answer 1

要使用jQuery，请替换

 $("ul li[rel=" + req_id + "]").removeClass().addClass('complete') $("ul li[rel=" + req_id + "]").child('.controls').child('.delete').css('visibility','visible') 

通过：

 $("ul li[rel=" + req_id + "]").removeClass().addClass('complete').find('.controls .delete').show(); 

但是，您应该使用CSS。 所以保留你原来的jQuery并将其添加到CSS：

 ul li .controls .delete { display: block; } ul li.complete .controls .delete { display: none; } 

Answer 2

你想改变

 $("ul li[rel=" + req_id + "]").child('.controls').child('.delete').css('visibility','visible') 

至

 $("ul li[rel=" + req_id + "] .controls .delete").show() 

应该很好地工作。

我倾向于使用display属性 – display:none;而不是可见性display:none; 或display:block; 或display:inline;