How Do I Replace A [Img] [/Img] Tag With An Imgae

Question

0.00/5 (No votes)

See more:

When someone comment on Blogger with [img][/img] tag then this HTML code is published. Assume the code like that

HTML

<div id="mm">[img]https://www.gravatar.com/avatar/4ce47f47105a3bd1ca4700f02b5deff1?s=32&d=identicon&r=PG[/img]</div>

Our javascript should find the [img] tag and replace that with an image. So javascript may be like this:

JavaScript

var s;
s = document.getElementById("mm").innerHTML
s = s.replace("[img]","'");  
s = s.replace("[/img]","'"); 
var b;
b = "<img src="+s+"></img>"
document.getElementById("mm").innerHTML = b;

it works when the div id="mm" contains only [img] [/img] tag. but when their is other text or code then it fails to thdisplay e image. Please help me. Thanks in advance

Posted 19-Jun-14 2:41am

Mrinmoy Das

Updated 19-Jun-14 2:43am

v2

Add a Solution

Comments

Snesh Prajapati 19-Jun-14 9:03am

As you are saying "when their is other text or code then it fails to display the image". Can you write that text or code, which is creating the problem ?

Mrinmoy Das 19-Jun-14 10:44am

I mean if i write <div id="mm"> Hi friends! i am posting a picture with my comment. [img]https://www.gravatar.com/avatar/4ce47f47105a3bd1ca4700f02b5deff1?s=32&d=identicon&r=PG[/img]</div> then in the javascript variable s stores all the html code and after replacing [img] & [/img] it gives img url with the other text. Actually i want to replace [img]....[/img] tag with a picture. thats all. thanks snesh prajapati for responding. i think you can help me. @SneshPrajapati

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Snesh Prajapati · Answer 1 · 2014-06-19T05:57:00

I have modified the code for demo and below code is working as expected:
(for verification I have put alert for url, you can remove that)

<div id="mm">Some Crap Text[img]https://www.gravatar.com/avatar/4ce47f47105a3bd1ca4700f02b5deff1?s=32&d=identicon&r=PG[/img]Some Crap Text
</div>

<script>
    var s;
    s = document.getElementById("mm").innerHTML
    var afterImg = s.split("[img]")[1];
    var url = afterImg.split("[/img]")[0];
    alert(url);
    var b = "<img src=" + url + "></img>"
    document.getElementById("mm").innerHTML = b;
</script>

Please let me know if any further issue. Thanks.

**Joezer BH** · Answer 2 · 2014-06-19T03:26:00

Solution 1

You are placing the content of the [img][/img] structure into the

HTML

<img src="Your captured content enters here after the JS execution"></img>

If the content of the [img][/img] does not make a valid src property, obviously it will not show the intended image.

Cheers.
C

Posted 19-Jun-14 3:26am

Joezer BH

Comments

Mrinmoy Das 19-Jun-14 10:47am

yes you understood. if the src is right then image must visible.. but how to extract the src from a text like this :
" Hello i am uploading a pic [img](picture url)[/img] "

Joezer BH 22-Jun-14 8:27am

In this case, instead of:
s = s.replace("[img]","'");
s = s.replace("[/img]","'");

do:

var b = s.split("[img]")[1];
b = b.split("[/img]")[0];
b = "<img src='" + b + "'></img>";

Cheers,
C