html - When I update value of textbox in plain JavaScript, the text value is invisible -
i can't see why function inserts value of textbox invisible. tried changing hidden field plain visible field, didn't either. grateful enlightenment. here full page code, sorry german:
<head> <style> body{ background: #111; color: #d00; } input{ background: #111; color: #c90; font-size: 1.4em; font-weight: bold; border-radius: 7px; } #aaa{ top: 10%; height: 20%; left: 30%; width: 40%; background: #133; color: teal; font-weight: bold; border: inset 3px #2d2d2d; -moz-border-top-left-radius:8px; -webkit-border-top-left-radius: 8px; -o-border-top-left-radius: 20px; border-top-left-radius: 8px; -moz-border-top-right-radius:8px; -webkit-border-top-right-radius: 8px; -o-border-top-right-radius: 20px; border-top-right-radius: 8px; -moz-border-bottom-left-radius:8px; -webkit-border-bottom-left-radius: 8px; -o-border-bottom-left-radius: 20px; border-bottom-left-radius: 8px; -moz-border-bottom-right-radius:8px; -webkit-border-bottom-right-radius: 8px; -o-border-bottom-right-radius: 20px; border-bottom-right-radius: 8px; } #aaa{ top: 10%; height: 20%; left: 20%; width: 60%; background: #333; color: #d00; padding: 2%; font-weight: bold; border: outset 3px #2d2d2d; -moz-border-top-left-radius:8px; -webkit-border-top-left-radius: 8px; -o-border-top-left-radius: 20px; border-top-left-radius: 8px; -moz-border-top-right-radius:8px; -webkit-border-top-right-radius: 8px; -o-border-top-right-radius: 20px; border-top-right-radius: 8px; -moz-border-bottom-left-radius:8px; -webkit-border-bottom-left-radius: 8px; -o-border-bottom-left-radius: 20px; border-bottom-left-radius: 8px; -moz-border-bottom-right-radius:8px; -webkit-border-bottom-right-radius: 8px; -o-border-bottom-right-radius: 20px; border-bottom-right-radius: 8px; position: absolute; } #geheime{ visibility: hidden; } #ang{ top: 7%; height: 20%; left: 10%; width: 80%; text-shadow: 2px 2px #111; font-weight: bold; position: absolute; } #kaste{ top: 30%; height: 20%; left: 10%; width: 80%; font-weight: bold; position: absolute; } #fichs{ top: 68%; height: 20%; left: 20%; width: 30%; font-weight: bold; position: absolute; } #schicks{ top: 68%; height: 20%; right: 20%; width: 30%; font-weight: bold; position: absolute; } .klknopfr { background: linear-gradient(to bottom, #f11 0%, #400 100%); /* w3c */ color:#ddd; font-weight: bold; font-size: 1.4em; text-shadow: -1px -1px #411; /*-moz-border-top-right-radius:8px;*/ /*-webkit-border-bottom-left-radius: 8px;*/ /*-o-border-bottom-right-radius: 20px; */ border-radius: 8px; } .klknopfg { background: linear-gradient(to bottom, #1f1 0%, #141 100%); /* w3c */ color:#ddd; font-weight: bold; font-size: 1.4em; text-shadow: -1px -1px #141; /*-moz-border-top-right-radius:8px;*/ /*-webkit-border-bottom-left-radius: 8px;*/ /*-o-border-bottom-right-radius: 20px; */ border-radius: 8px; } .klb { background: #4ff; color:#d00; } </style>
<?php // include('schaltsatze.php'); $volleanreihe = array('hat revealed einzelheiten von sein balance sheet fuer', '$land tech einstellung'); ?> <div id="geheime"> <?php echo ($volleanreihe[0]); ?> </div><!-- geheime --> <div id="ang"> <center> <?php echo ($volleanreihe[0]); ?> </center> </div><!-- ang --> <div id="kaste"> <center> <input type="text" style="color:#c90" id="neusatz" name="neusatz" onmouseover="focus(this)" value="??"> </center> </div><!-- kaste --> <div id="fichs"> <center> <input type="button" class="klknopfr" value="fich's" onclick="stopfselbe()"> </center> </div><!-- untwirf --> <div id="schicks"> <center> <input type="button" class="klknopfg" value="schick's"> </center> </div><!-- untwirf --> </div><!-- aaa --> <script> function stopfselbe(){ var e = document.getelementbyid('geheime'); var = e.innerhtml; var f = document.getelementbyid('neusatz'); f.value=i; alert(i); // document.write(i); } </script>
pretty odd should end answering first ever question on stackoverflow, in case else meets same problem...
the reason nothing showing in textbox whitespace between 2 div tags being picked .innerhtml, , numerous tabs/spaces appearing in textbox once obtained value inserted. , didn't notice alert message skewed. actual desired value there along, textbox short visible.
a better solution have been
var e = document.getelementbyid('geheime'); var = e.innerhtml.trim();