📜  找不到源图像时如何隐藏“找不到图像”图标?

📅  最后修改于: 2021-11-09 09:27:17             🧑  作者: Mango

JavaScriptjQuery可用于在未找到图像时隐藏“未找到图像图标。基本思想是在出现错误时将图像对象的显示属性设置为“隐藏” 。让我们考虑以下显示 GeeksforGeeks 徽标的 HTML 代码以进行演示。
示例:在本示例中,我们不会隐藏找不到图像的图标。

html


    
    
    
        

            Example to hide the 'Image Not Found' icon i.e.                      

             


html


    
    
    
        

            Example to hide the 'Image Not Found' icon i.e.                      

                      


html

    
    
    
        

            Example to hide the 'Image Not Found' icon i.e.                      

             


html


    
        
    
    
        

            Example to hide the 'Image Not Found' icon i.e.                      

             


输出:

  • 当图像可用时:

  • 找不到图片时:

隐藏图像错误图标的方法:

  • 使用 onerror() 事件:当相应的项引发错误时,会自动调用 onerror 事件。当未找到图像时,onerror 事件同时调用 hideImg()函数,该函数会将图像的可见性设置为隐藏。
    程序:

html



    
    
    
        

            Example to hide the 'Image Not Found' icon i.e.                      

                      
  • 使用速记法:您可以将此速记法应用于 HTML 事件。这会将参考对象的可见性设置为隐藏。
    程序:

html


    
    
    
        

            Example to hide the 'Image Not Found' icon i.e.                      

                 
  • 使用 jQuery:使用JQuery错误处理函数error() ,我们可以捕获错误并使用hide()函数隐藏对象。
    注意: error()函数已从 jquery 3.0 版中删除。然后。
    程序:

html



    
        
    
    
        

            Example to hide the 'Image Not Found' icon i.e.                      

             

输出:以上所有代码都给出相同的输出。