Full version: jsB@nk » Form » Textarea » JavaScript OOP with Input Display Toggle
URL: https://www.javascriptbank.com/javascript-oop-with-input-display-toggle.html
Usage of this JavaScript code effect is just toggle (show/display) the input text fields when the users click the specified input checkboxes. But this JavaScript code example made with OOP skills, it's still a good JavaScript code example for JavaScript OOP beginners.
Full version: jsB@nk » Form » Textarea » JavaScript OOP with Input Display Toggle
URL: https://www.javascriptbank.com/javascript-oop-with-input-display-toggle.html
<script type="text/javascript">// Created by: Fang | http://www.webdeveloper.com/forum/showthread.php?p=872326#post872326// This script downloaded from www.JavaScriptBank.comfunction addElement() {var aInput=document.getElementById('myspan').getElementsByTagName('input');for(var i=0; i<aInput.length; i++) { aInput[i].onclick=new Function('addDelete(this)'); }}function addDelete(obj) {var parentSpan=document.getElementById('myspan');if(obj.nextSibling.nodeName!='INPUT') { // add var oInputText=document.createElement('input'); oInputText.setAttribute('type', 'text'); parentSpan.insertBefore(oInputText, obj.nextSibling); }else { // delete parentSpan.removeChild(obj.nextSibling); }}// Multiple onload function created by: Simon Willison// http://simonwillison.net/2004/May/26/addLoadEvent/function addLoadEvent(func) { var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = func; } else { window.onload = function() { if (oldonload) { oldonload(); } func(); } }}addLoadEvent(function() { addElement();});</script><span id="myspan"> <input type="checkbox"> <input type="checkbox"> <input type="checkbox"></span>