Wednesday 15 September 2010

javascript - Show element when the user starts typing -


Is this possible with Javascript? Right now, I use it, which shows the element when textiera is centered but can I show it only when it is focused and something recorded in tactia?

  & lt; Form action = "#" method = "post" & gt; & Lt; Textarea onfocus = "document.getElementById ('submit'). Style.display = 'block';" Id = "text" style = "width: 540 px; height: 50px; overflow: hidden;" & Gt; & Lt; / Textarea & gt; & Lt; Input id = "submit" type = "submit" value = "submit" style = "display: hidden" & gt; & Lt; / Form & gt;   

Edit

Spencer tried J Code, but it just does not work. The submit button is used.

  & lt ;! DOCTYPE html public "- // W3C // DTT XHTML 1.0 Transcription // N" "http://www.w3.org/TR /xhtml1/DTD/xhtml1-transitional.dtd"> & Lt; Html xmlns = "http://www.w3.org/1999/xhtml" & gt; & Lt; Top & gt; & Lt; Title & gt; Test & lt; / Title & gt; & Lt; Style type = "text / css" & gt; #text {width: 540px; Height: 50px; Hidden flurry; } #submit {display: none; } & Lt; / Style & gt; & Lt; Script & gt; Var textInput = document.getElementById ('text'), submit button = document.getElementById ('submit'); Function checkTextValue () {if (textInput.value! == '') {submitButton.style.display = 'block'; } Else {submitButton.style.display = 'none'; }} & Lt; / Script & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Form action = "#" method = "post" & gt; & Lt; Textarea onkeypress = "checkTextValue ()" onkeyup = "checkTextValue ()" onchange = "checkTextValue ()" id = "text" & gt; & Lt; / Textarea & gt; & Lt; Input id = "submit" type = "submit" value = "submit" & gt; & Lt; / Form & gt; & Lt; / Body & gt; & Lt; / Html & gt;    

Use onkeypress, onkeyup, and onchange to detect changes in value , And then set it according to whether it is empty or not.

HTML:

  & lt; Form action = "#" method = "post" & gt; & Lt; Textarea onkeypress = "checkTextValue ()" onkeyup = "checkTextValue ()" onchange = "checkTextValue ()" id = "text" & gt; & Lt; / Textarea & gt; & Lt; Input id = "submit" type = "submit" value = "submit" & gt; & Lt; / Form & gt;   

JS:

  var textInput = document.getElementById ('text'), submit button = document.getElementById ('submit'); Function checkTextValue () {if (textInput.value! == '') {submitButton.style.display = 'block'; } Else {submitButton.style.display = 'none'; }}   

CSS:

  #text {width: 540px; Height: 50px; Hidden flurry; } #submit {display: none; }    

No comments:

Post a Comment