বেস 64 নিয়ে আমি কীভাবে চিত্র উত্স সেট করতে পারি


96

আমি ইমেজ উত্সটি একটি বেস 64 উত্সে সেট করতে চাই তবে এটি কার্যকর হয় না:

জেএসফিডাল.নাট / এনটি 9 কেবি

<img id="img" src="" />

জাভাস্ক্রিপ্ট

document.getElementById("img").src = "data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg=="

9
আপনি বেস 64 স্ট্রিংয়ের লাইন ব্রেকগুলি সরিয়ে ফেললে এটি কাজ করে। ফিডল আপডেট হয়েছে।
অ্যাড্রিয়ানো রেপিটি

উত্তর:


140

setAttributeপরিবর্তে ব্যবহার করার চেষ্টা করুন :

document.getElementById('img')
    .setAttribute(
        'src', 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=='
    );

আসল উত্তর: (এবং আপনি বেস 64 এর লাইন-ব্রেকগুলি সরিয়েছেন তা নিশ্চিত করুন))


thx, আমি 10 মিনিটের মধ্যে গ্রহণ করব, কেন সেটএট্রিবিউট ভাল?
পপপেল

@ পোপেল আমি এটি বিবেচনা করি বলে মনে করি না, তবে আপনার ফিডলটি ঠিক করার জন্য আমার প্রথম প্রচেষ্টাটি ছিল setAttribute। এটি ব্যর্থ হওয়ার পরে আমি বেস 64 এনকোডিংয়ে লাইন-ব্রেকগুলি লক্ষ্য করেছি। (যেহেতু আমি উত্তর জমা দেওয়ার জন্য ছুটে যাচ্ছিলাম, তাই src=লাইন ব্রেকগুলি ঠিক করার পরেও আমি এটি চেষ্টা করিনি ))
কেভিন বাউচার

26

আপনি যদি বেস 64 থেকে চিত্রটি সেট করতে jQuery ব্যবহার করতে পছন্দ করেন তবে:

$("#img").attr('src', 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==');

4
@ ট্রুথসারুম আমরা এটি ব্যবহার করছি না, যেহেতু আমরা একটি প্রতিক্রিয়া স্ট্যাকের দিকে চলে যাই। তবে মজা করার জন্য, আপনার কাছে নিজের দাবি প্রমাণ করার মতো পরিসংখ্যানিক প্রমাণ রয়েছে কি? আপনি কি সত্যিই ভাবেন যে jQuery ব্যবহার করে কোনও লিগ্যাসি ওয়েব অ্যাপস নেই? আপনার মন্তব্যটি আপনার ব্যক্তিগত মতামত এবং সত্যই আমার ব্যক্তিগত সময় নষ্টের উপর ভিত্তি করে। এছাড়াও আপনি যদি প্রকল্পটি যাচাই করেন তবে এটি এখনও বজায় রাখা হয় এবং এর একটি বিশাল অনুগামী বেস রয়েছে। github.com/jquery/jquery/commits/master
Faris Zacina

4
এছাড়াও @ ট্রুথসেরাম এখানে কিছু পরিসংখ্যান রয়েছে, যেহেতু আপনার মন্তব্য পোস্ট করার আগে আপনি সেগুলি পরীক্ষা করার সুযোগ পান নি: google.com/trends/…
ফারিস জ্যাকিনা

এই দিনগুলিতে, ডিওএম আপডেট করার propপরিবর্তে ব্যবহার করা উচিত attrattrলোডিং উপর মূল পৃষ্ঠা অবস্থা বোঝায়।
অ্যান্টন চ্যানিং

6
img = new Image();
img.src = "data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="
img.outerHTML;
"<img src="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==">"

4

আপনার সমস্যাটি সিআর (গাড়ীর ফিরে)

http://jsfiddle.net/NT9KB/210/

তুমি ব্যবহার করতে পার:

document.getElementById("img").src = "data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="

ঠিক এখানে সমাধান কি?
এএইচএইচ

সমাধানটি হ'ল বেস 64 থেকে লাইন ব্রেক (ক্যারেজ রিটার্ন) অপসারণ করা
কেভিন বাউচার
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.