StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>Inline javascript is considered bad practice</p> <p>ie. <code>onClick=""</code></p> <p>Use something like this instead</p> <pre><code><input id="info" type="button" value="Customer Info"> <div id="myDiv"> <form>Name: <input type="text" value="" id="name" name="name"> </input> </form> </div> var button = document.getElementById("info"); var myDiv = document.getElementById("myDiv"); function show() { myDiv.style.visibility = "visible"; } function hide() { myDiv.style.visibility = "hidden"; } function toggle() { if (myDiv.style.visibility === "hidden") { show(); } else { hide(); } } hide(); button.addEventListener("click", toggle, false); </code></pre> <p>on <a href="http://jsfiddle.net/Xotic750/3WMsq/" rel="nofollow">jsfiddle</a></p> <p>Here is the code suggested by David Thomas in the comments. It performs exactly the same task, but uses shorthand if-else for the <code>toggle</code> function and doesn't provide you with separate <code>show</code> and <code>hide</code> functions.</p> <pre><code><input id="info" type="button" value="Customer Info"> <div id="myDiv"> <form>Name: <input type="text" value="" id="name" name="name"> </input> </form> </div> var button = document.getElementById("info"); var myDiv = document.getElementById("myDiv"); function toggle() { myDiv.style.visibility = myDiv.style.visibility === "hidden" ? "visible" : "hidden"; } toggle(); button.addEventListener("click", toggle, false); </code></pre> <p>on <a href="http://jsfiddle.net/Xotic750/MecJx/" rel="nofollow">jsfiddle</a></p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload