How to pass the Syntax or Semantics written in the text field, to a Textarea

Question

How to pass the Syntax or Semantics written in the text field, to a Textarea

Navigation

#1 by (1 votes)
#2 by (0 votes)

0

Let's face it, this is more of a doubt than a logical reasoning.

I have some input in the HTML page, and it even passes its value (s) to textarea , at the click of a button.

Great, so far so good! I developed as I described above.

But I've faced such an obstacle.

When writing HTML semantics, next to Javascript syntax. These text fields do not pass syntax to within textarea .

This occurs after the inclusion of event onclick() , within element img

Minimized code for analysis:

Javascript

 function gera(){
 var a = document.all.txt.value;

 document.all.cod.value='<img src="'+a+'" onclick="this.src=''; document.embeds[0].style.display ='block';"/>'
 }

HTML

<p>Video Thumbnail(Image):</p>
<input type="text" id="txt" value="http://"   size="60"/>

<p>Código Fonte:</p>
<textarea id="cod" rows="10" cols="50" style="color:indianred"></textarea>

<hr size=1 color=silver>

<center>
<input type="button" onclick="gera()" value="Gerar Codigo Fonte"/>
</center>

javascript html object embed

asked by anonymous 14.05.2016 / 21:21

2 answers

Explanation of a php array and how to access the x position of the PHP array [closed] Insert arrow into an input submit for when jsf rendering appears on the button

score 1 · Answer 1

As far as I could see, your mistake was not having escaped the single quotes within your string. If you are using exactly this syntax in the project, you need to define the otherwise generates function as well, which is assigning it to a variable without using the reserved word var. If you do not assign it to a variable in this way, it will be out of the global scope, and at the time of the onclick it will accuse you of being undefined.

Follow your code with the above fixes in jsfiddle: link

score 0 · Answer 2

Because of the Sergio comment just above.

Having escaped the single quotes from within the string , was the fundamental point for everything to come out correctly in textarea .

See:

function gera()
{
var a = document.all.a.value;
var b = document.all.b.value;
var c = document.all.c.value;
var d = document.all.d.value;
var e = document.all.e.value;

document.all.cod.value='<img id="v" src=\"'+b+'\" title="'+a+'" alt="'+a+'" onclick="this.src=\'\'; document.embeds[0].style.display=\'block\';"/><embed nocache="0" type="application/mplayer" width="'+d+'" height="'+e+'" showcontrols="true" autostart="1" src="'+c+'" style="display:none"/><br><span><a href="http://mplayerplug-in.sourceforge.net/" target="_blank"><img src="http://mplayerplug-in.sourceforge.net/plugin-art/mplayerplug-in.gif"border="0"></a></span>';
}

function ver()
{
var obj = document.all.cod.value;
var janela = window.open("","janela","width=500px, height=500px");
janela.document.write("<html>\n<head>\n");
janela.document.write("<title></title>\n");
janela.document.write("</head>\n<body>\n"+obj+"\n");
janela.document.write("</body>\n</html>\n");
}

<p>Titulo:</p>

<input type="text" id="a" value=""   size="60"/>

<p>URL Image:</p>
<input type="text" id="b" size="60" value="https://img.youtube.com/vi/XyelvuqYMhA/default.jpg" onblur="if(this.value == '') {this.value = 'https://img.youtube.com/vi/XyelvuqYMhA/default.jpg';}" onfocus="if(this.value == 'https://img.youtube.com/vi/XyelvuqYMhA/default.jpg') {this.value = '';}"/>

<p>URL Video:</p>
<input type="text" id="c" size="60" value="https://www.youtube.com/watch?v=XyelvuqYMhA" onblur="if(this.value == '') {this.value = 'https://www.youtube.com/watch?v=XyelvuqYMhA';}" onfocus="if(this.value == 'https://www.youtube.com/watch?v=XyelvuqYMhA') {this.value = '';}"/>

<p>Largura:</p>
<input type="text" id="d" value="176"   size="5"/>px

<p>Altura:</p>
<input type="text" id="e" value="144" size="5"/>px

<p>Código Embed:</p>
<textarea id="cod" rows="10" cols="50" style="color:indianred"></textarea>

<hr size=1 color=silver>

<center>
<input type="button" onclick="gera()" value="Gerar Codigo Fonte"/>&nbsp; &nbsp; &nbsp; &nbsp;<input type="button" onclick="ver()" value="Rodar Codigo Fonte"/>
</center>

Explaining each process

1) After filling in the fields it's time to generate the code embed to enter the Site / Blog.

Once this is done, it will be time to execute.

2) The user clicks on this video image, which will then be disabled by this.src='' syntax.

Given tag title that until then the tag img contained.

3) The object embed is then retrieved by the document.embeds[0].style.display = 'block' method, which was previously hidden by the style="display:none" rule.

Once discovered, the Video is displayed.

In other words, the mplayer plug-in is silently waiting for the mouse-click thumbnail to do so.