এইচটিএমএল যদি চিত্র না পাওয়া যায়

Question

এইচটিএমএল পৃষ্ঠায় আমার একটি চিত্র রয়েছে:

<img src="smiley.gif" alt="Smiley face" width="32" height="32" />

চিত্রটি সার্ভারে পাওয়া না গেলে এটি একটি কুৎসিত ফাঁকা স্কোয়ার দেখায়।

আমি এটি তৈরি করতে চাই যাতে কোনও চিত্র না পাওয়া গেলে এটি কিছুই বা অন্য কোনও ডিফল্ট চিত্র প্রদর্শন করবে না যা আমি জানি সার্ভারে অবশ্যই রয়েছে।

কিভাবে এই কাজ করা যেতে পারে?

Comments

আমি ফেভিকন পাচ্ছি, কিছু সাইট এগুলি নেই।

— ডেভিড 19801

সেক্ষেত্রে কোন স্ট্যাটাস কোডটি ফিরে আসে তা দেখতে প্রথমে কোনও সার্ভার-সাইড বা ক্লায়েন্ট-সাইড অনুরোধ করবেন?

— পেক্কা

আমি জেএস ব্যবহার না করার চেষ্টা করছি কারণ আমি ধীর ওয়েবসাইটগুলি পছন্দ করি না এবং এটি সার্ভারের পক্ষে করার জন্য প্রচুর ফ্যাভিকন রয়েছে, এটি সার্ভারটিকে নিষিদ্ধ করবে।

— ডেভিড 19801

কে সেই নির্বোধ যে আপনাকে জাভাস্ক্রিপ্ট বলেছিল ওয়েবসাইটটি ধীর করে দেবে ??

— Qchmqs

@ পেপকা course অবশ্যই আপনার সাইটে কার্যকারী লিঙ্ক থাকা উচিত। লিঙ্কগুলি যদি আপনার নিজের সাইটে না থাকে তবে অন্য কারও কি হয়? বা যদি তারা কোনও দূরবর্তী ডেটা স্টোর থেকে আসে এবং ডাউনলোড করতে কিছুটা সময় নেয় তবে কী হবে?

— লেথেগুয়ে

Answer 1

আপনার সমস্যা সমাধানের সর্বোত্তম উপায়:

<img id="currentPhoto" src="SomeImage.jpg" onerror="this.onerror=null; this.src='Default.jpg'" alt="" width="100" height="120">

onerror আপনার জন্য একটি ভাল জিনিস :)

কেবল চিত্র ফাইলের নাম পরিবর্তন করুন এবং নিজের চেষ্টা করুন।

Comments

একটি দরকারী ওয়েল ট্যাগের সাথে সংযুক্ত এটি সমস্যা সমাধানের দুর্দান্ত উপায়!

— mlibby

আশ্চর্য! নিখুঁত সমাধান

— এমানুয়েল পাভেনেলো

যদি Default.jpg উপলব্ধ না হয় আপনি একটি অন্তহীন লুপে শেষ হবে। আপনার একটি চেক যোগ করা উচিতif (this.src != 'Default.jpg')

— dehlen

অসীম লুপগুলি এড়াতে এবং এর চেয়ে আরও ভাল: this.onerror=null;নীচে @ সুদর্শন দিয়েছিলেন।

— গিলিয়াম এফ।

সঙ্গে কাজ যে কেউ প্রতিক্রিয়া, আপনি এখানে উল্লেখ করতে পারেন stackoverflow.com/questions/34097560/...

— Earlee

Answer 2

ভাল আপনি এই চেষ্টা করতে পারেন।

  <object data="URL_TO_Default_img.png" type="image/png">
   <img src="your_original_image.png" />
  </object>

এটি আমার জন্য কাজ করেছে। আমাকে আপনার সম্পর্কে জানাতে দিন

Comments

সমস্ত বড় ব্রাউজারে কাজ করে মনে হচ্ছে। স্রেফ ডিফল্ট এবং আসল। সুতরাং সেই অবজেক্টটি মূল চিত্রটি এবং img ডিফল্ট একটিকে রেন্ডার করে

— Evgeny

Answer 3

ঠিক আছে তবে আমি এইভাবে ব্যবহার করতে চাই, যাতে যখনই মূল চিত্র পাওয়া যায় না তখন আপনি আপনার ডিফল্ট চিত্রটি লোড করতে পারেন যা আপনার প্রিয় স্মাইলি বা চিত্র হতে পারে দুঃখিত বলে! উপলভ্য নয়, তবে উভয় চিত্র অনুপস্থিত থাকলে আপনি প্রদর্শন করতে পাঠ্য ব্যবহার করতে পারেন। যেখানে আপনি তখন হাসিখুশি করতে পারেন। প্রতিটি কেস প্রায় কভার দেখুন।

<img src="path_to_original_img/img.png"  alt="Sorry! Image not available at this time" 
       onError="this.onerror=null;this.src='<?=base_url()?>assets1/img/default.jpg';">

Comments

আপনি যদি অনুসন্ধান ইঞ্জিনগুলি দ্বারা পৃষ্ঠাটি সঠিকভাবে বিশ্লেষণ করতে চান তবে ত্রুটি পাঠ্যের জন্য Alt ব্যবহার করবেন না। অনুসন্ধান ইঞ্জিনগুলি আপনার সামগ্রীর ডেটা ভুলভাবে সূচক করতে পারে।

— Varela

কি করে <?=base_url()?>? আপনি আশ্চর্যরকমভাবে কেন কিছু সার্ভার-সাইড এবং ফ্রেমওয়ার্ক-ভিত্তিক কোড যুক্ত করবেন?

— নিকো হাজেস

@ নিকোহেস এর পিএইচপি ফ্রেমওয়ার্ক থেকে এর ইউআরএল, ভাল আপনি সর্বদা ইমেজটির জন্য নিজের ইউআরএল লিখতে পারেন, আমি একটি উদাহরণ দিয়েছি যার অর্থ এই নয় যে আপনার এটি অনুলিপি করে আটকাতে হবে বা সেই ইউআরএলটিতে মনোনিবেশ করা উচিত, আপনি নিজের ইউআরএলটি অন্তর্ভুক্ত করেন। ব্যাখ্যা করার জন্য আপনাকে উদাহরণ দিতে হবে তাই আমি করেছি।

— সুদর্শন কালেবরে

Answer 4

এখানে কোড স্নিপেটের নীচে চেক করুন যা এর মধ্যে আমি চিত্রটির নামটি মিস করেছি। সুতরাং, কেবলমাত্র এটির কারণে এটি বিকল্প চিত্রটি খুঁজে পাওয়া যায়নি চিত্র হিসাবে দেখা যাচ্ছে (404.svg)।

<img id="currentPhoto" src="https://www.ccrharrow.org/Images/content/953/741209.pg" onerror="this.src='https://www.unesale.com/ProductImages/Large/notfound.png'" alt="">

Answer 5

বিকল্পের জন্য, যদি চিত্রটি বিদ্যমান না থাকে - কিছুই দেখায় না। (আমি যা খুঁজছিলাম)

আপনি "এই.রিমোভ ()" এর "অনিরর" বৈশিষ্ট্যে রবি শ এর উত্তর থেকে ফাংশনটি অদলবদল করতে পারেন।

<img id="currentPhoto" src="SomeImage.jpg" alt='1' width="100" height="120">
<img id="currentPhoto" src="SomeImage.jpg" onerror="this.onerror=null; this.remove();" alt="2" width="100" height="120">

Answer 6

এই দৃশ্যটি পরিচালনা করার স্বাভাবিক উপায় হ'ল altট্যাগটিকে অর্থপূর্ণ কিছুতে সেট করা ।

আপনি যদি এর পরিবর্তে কোনও ডিফল্ট চিত্র চান তবে আমি অনুরূপ ফর্ম্যাট ব্যবহার করে আপনার চিত্রগুলি পরিবেশন করতে একটি সার্ভার-সাইড প্রযুক্তি ব্যবহার করার পরামর্শ দিচ্ছি:

<img src="ImageHandler.aspx?Img=Blue.jpg" alt="I am a picture" />

ইন ImageHandler.aspxকোড, কোনো ফাইল-পাওয়া ত্রুটি ধরা ও আপনার পরিবেশন default.jpgপরিবর্তে।

Answer 7

আপনি যোগ করে বিকল্প পাঠ্যটি প্রদর্শন করতে পারেন alt:

<img src="my_img.png" alt="alternative text" border="0" /> 

Comments

হতে পারে এই স্কোয়ারটি

— দ্বি

যদি

— ইমগ

Answer 8

আমি চিত্রটির চারপাশে একটি অভিভাবক ডিভ যুক্ত করেছি এবং আসল চিত্রটি আড়াল করার জন্য নিম্নলিখিত অনারআর ইভেন্ট হ্যান্ডলারটি ব্যবহার করেছি কারণ আইই তে এখনও একটি কুৎসিত চিত্র-সন্ধান পাওয়া যায়নি চিত্রটি Alt বৈশিষ্ট্যটি ব্যবহার করার পরে দেখানো হয়েছিল:

<div style=" width:300px; height:150px; float:left; margin-left:5px; margin-top:50px;">
        <img src='@Url.Content("~/Images/Logo-Left.png")' onerror="this.parentElement.innerHTML = '';" />
</div>

Answer 9

কুরুচিপূর্ণ বর্গক্ষেত্রটি দূরে সরিয়ে border=0রাখতে imgট্যাগ ব্যবহার করে চেষ্টা করুন ।

<img src="someimage.png" border="0" alt="some alternate text" />

Answer 10

আমি <img>ট্যাগ দ্বারা দখল করা জায়গাটি লুকিয়ে রাখতে চেয়েছিলাম যাতে এটি আমার পক্ষে কাজ করে

<img src = "source.jpg" alt = "" >

Answer 11

আপনি যদি কোনও পাঠ্যের পরিবর্তে বিকল্প চিত্র চান তবে আপনি পিএইচপি ব্যবহার করতে পারেন:

$file="smiley.gif";
$alt_file="alt.gif";
if(file_exist($file)){
     echo "<img src='".$file."' border="0" />";
}else if($alt_file){
     // the alternative file too might not exist not exist
     echo "<img src='".$alt_file."' border="0" />";
}else{
  echo "smily face";
}

Answer 12

এটি পরিচালনা করার সহজ উপায়, কেবল একটি পটভূমি চিত্র যুক্ত করুন।

Answer 13

পিএইচপি চেষ্টা করুন

if (file_exists('url/img/' . $Image)) {
    $show_img_URL = "Image.jpg";
} else {
    $show_img_URL = "Image_not_found.jpg";
}

Answer 14

এটি আমার জন্য কাজ করে যে আপনি যদি চিত্রের বিরতিতে Alt বৈশিষ্ট্যটি ব্যবহার করতে না চান তবে আপনি কোডের এই অংশটি ব্যবহার করতে পারেন এবং সেই অনুযায়ী সেট করতে পারেন।

<h1>
  <a> 
   <object data="~/img/Logo.jpg" type="image/png">
     Your Custom Text Here
   </object>
  </a>
</h1>

Answer 15

এই আমার জন্য কাজ করে। srcset ব্যবহার করে। আমি সবেমাত্র এটি সম্পর্কে জানতে পেরেছি তাই ব্রাউজারগুলি এটি সমর্থন করে কিনা তা আমি জানি না তবে এটি আমার পক্ষে কাজ করেছে। এটি চেষ্টা করুন এবং পরে আমাকে আপনার ফিড ফিরিয়ে দিন।

 <img src="smiley.gif" srcset="alternatve.gif" width="32" height="32" />

Answer 16

সমাধান - আমি img এর উচ্চতা এবং প্রস্থের উপাদানগুলি সরিয়েছি এবং তারপরে Alt পাঠ্যটি কাজ করে।

<img src="smiley.gif" alt="Smiley face" width="32" height="32" />

প্রতি

<img src="smiley.gif" alt="Smiley face" />

সবাইকে ধন্যবাদ.

Comments

সুতরাং আপনি নিজেকে "সঠিক উত্তর" দিয়েছিলেন তবে আপনি এই প্রশ্নের উত্তর সম্পর্কিত উত্তর দিয়েছিলেন, জিজি ডাব্লুপি।

— জিন-পল

ওহ এই সমস্ত সঠিক উত্তরগুলির বাইরে তার নিজের উত্তর গ্রহণ করেছে হাহাহাহা, নিজেকে লালন করার ভাল উপায়।

— সুদর্শন কালেবরে

ডি: এটা প্রথমবার নয় stackoverflow.com/a/12768098/1545917

— Ghilas BELHADJ

এই উত্তরটি কোনও বিকল্প চিত্র সরবরাহ করে নি।

— প্যাট্রিক নট

@ ডেভিড ১৯৮০১ কে কি বোঝাতে হবে?

— পি সতীশ প্যাট্রো