Unable to access dynamically changed JavaScript with dynamic HTML -
& lt; शैली & gt; * {मार्जिन: 0; पैडिंग: 0; } पाठयरा {resize: none; पैडिंग: 10 पीएक्स; ऊंचाई: 100 पिक्सेल; चौड़ाई: 50%; } #output {ऊंचाई: 100px; चौड़ाई: 50%; रंग: #fff; पृष्ठभूमि रंग: # 222; } & Lt; / style & gt; & Lt; शैली आईडी = "कस्टमस्टाइल" & gt; & Lt; / शैली & gt; & Lt; स्क्रिप्ट प्रकार = "टेक्स्ट / जावास्क्रिप्ट" & gt; फ़ंक्शन टॉगलहैम () {document.getElementById ('inputboxcss')। style.display = "none"; Document.getElementById ('inputboxjs')। Style.display = "none"; Document.getElementById ('inputboxhtml')। Style.display = ""; } समारोह togglecss () {document.getElementById ('inputboxhtml')। style.display = "none"; Document.getElementById ('inputboxjs')। Style.display = "none"; Document.getElementById ('inputboxcss')। Style.display = ""; } समारोह togglejs () {document.getElementById ('inputboxcss')। style.display = "none"; Document.getElementById ('inputboxhtml')। Style.display = "none"; Document.getElementById ('inputboxjs')। Style.display = ""; } setInterval (function updatehtml) (var x = document.getElementById ("inputboxhtml"); var y = document.getElementById ("आउटपुट"); y.innerHTML = x.value;}, 100); setInterval (function updatecss () {var x = document.getElementById ("inputboxcss"); var y = document.getElementById ("कस्टमस्टाइल"); y.innerHTML = x.value;}, 100); setInterval (function updatejs () {var x = document.getElementById ("inputboxjs"); var y = document.getElementById ("कस्टम स्क्रिप्ट"); y.innerHTML = x.value;}, 100); & Lt; / स्क्रिप्ट & gt; & lt; स्क्रिप्ट आईडी = "कस्टमस्क्रिप्ट" प्रकार = "टेक्स्ट / जावास्क्रिप्ट" & gt; & Lt; / स्क्रिप्ट & gt; & lt; button id = "togglehtml" onclick = "togglehtml ()" & gt; एचटीएमएल & lt; / बटन & gt; & lt; button id = "togglecss" onclick = "togglecss ()" & gt; सीएसएस & lt; / button & gt; & lt; button id = "togglejs" onclick = "togglejs ()" & gt; जेएस & lt; / button & gt; & lt; div id = "inputhtml" & gt; & Lt; textarea id = "inputboxhtml" onkeypress = "updatehtml ()" & gt; & lt; / textarea & gt; & Lt; / div & gt; & Lt; div id = "inputcss" & gt; & Lt; textarea id = "inputboxcss" onkeypress = "updatecss ()" & gt; & lt; / textarea & gt; & Lt; / div & gt; & Lt; div id = "inputjs" & gt; & Lt; textarea id = "inputboxjs" onkeypress = "updatejs ()" & gt; & lt; / textarea & gt; & Lt; / div & gt; & Lt; div id = "आउटपुट" & gt; & lt; / div & gt;
और आउटपुट विंडो ... संलग्न है जहां पहलेब्लॉक गतिशील एचटीएमएल दूसरे ब्लॉक गतिशील सीएसएस तीसरे ब्लॉक गतिशील जावास्क्रिप्ट और चौथे ब्लॉक आउटपुट विंडो ... मैं जेएसफ़ैडल की तरह ही चाहता हूं। लेकिन जावास्क्रिप्ट काम नहीं कर रहा है और html सीएसएस काम कर रहा है
आप अपना उत्तर यहां पा सकते हैं
मैंने स्क्रिप्ट फ़ंक्शन को जोड़ने का एक संशोधित संस्करण बनाया है:
फ़ंक्शन updatejs () {var x = document.getElementById ("inputboxjs"); ऐडस्क्रिप्ट ("कस्टमस्क्रिप्ट", एक्स। वेल्यू); } फ़ंक्शन addScript (id, script) {var headElement = document.getElementsByTagName ('HEAD')। आइटम (0); Var पुरानी लिपीएलेमेंट = दस्तावेज़.getElementById (आईडी); यदि (पुरानी लिपी एलेमेंट) हेड एलिमेंट। रिव्यू चाइल्ड (पुरानी लिपी एलेमेंट); var स्क्रिप्ट एलिमेंट = document.createElement ("स्क्रिप्ट"); scriptElement.type = "text / javascript"; ScriptElement.id = आईडी; scriptElement.appendChild (document.createTextNode (स्क्रिप्ट)); HeadElement.appendChild (स्क्रिप्ट एलेमेंट); } एक अन्य विधि जो लेख में उल्लिखित नहीं है, एक फ़ंक्शन ऑब्जेक्ट बना रहेगी, इसे कॉल करे, अपनी कस्टम स्क्रिप्ट को अपना दायरा दे:
function updatejs () {var x = document.getElementById ("inputboxjs"); var scriptFnc = नया फ़ंक्शन (x.value); scriptFnc (); } एक अंतिम बात, setInterval कॉल के भीतर अपने कार्यों को नाम देकर अर्थहीन है। अनुशंसित पठन:
-
-
-
Comments
Post a Comment