div

2013-06-01 7 views
5

के आंतरिक HTML को संशोधित नहीं कर सकता है, मैं किसी विशेष div के आंतरिक HTML को संशोधित करने का प्रयास कर रहा हूं, लेकिन मैं उस div की सामग्री को मिटाने के लिए नहीं जा सकता। मेरे पास निम्न कोड है:div

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Test</title> 
     <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    </head> 
    <body> 
     <script type="text/javascript"> 
      function reset() { 
       document.getElementById("results").innerHTML = ""; 
      } 
      function check() { 
       document.getElementById("results").innerHTML = "foo"; 
      } 
     </script> 
     <form name="form1"> 
      <input type="button" value="Check" onclick="check();"> 
      <input type="button" value="Reset" onclick="reset();"> 
     </form> 
     <div id="results"></div> 
    </body> 
</html> 

क्या कोई यह बता सकता है कि मैं इसे गलत कहां कर रहा हूं?

अग्रिम धन्यवाद।

+0

आप अपने कंसोल में किसी भी जावास्क्रिप्ट त्रुटियों हो रही है? –

+0

कृपया 'getElementById'' के बजाय '$ ('div # id_name') का उपयोग करने के लिए आदत प्राप्त करें। जेक्यूरी प्लगइन जोड़ने के लिए केवल एक चीज की आवश्यकता होगी। लेकिन जब आप जेएस का अधिक उपयोग करेंगे तो यह भविष्य में आपको बहुत मदद करेगा। – MaNKuR

+3

@MaNKuR यह आपकी सभी साइटों में jQuery आयात नहीं करने के लिए पूरी तरह से स्वीकार्य है। यह सब के बाद इतना हल्का नहीं है। –

उत्तर

8

ऐसा इसलिए है क्योंकि फ़ॉर्म में पहले से ही reset फ़ंक्शन है और इस फ़ंक्शन को स्वयं के बजाय बुलाया जाता है। उस नाम को बदलें और यह काम करेगा।

<script type="text/javascript"> 
     function r2() { 
      document.getElementById("results").innerHTML = ""; 
     } 
     function check() { 
      document.getElementById("results").innerHTML = "foo"; 
     } 
    </script> 
    <form name="form1"> 
     <input type="button" value="Check" onclick="check();"> 
     <input type="button" value="Reset" onclick="r2();"> 
    </form> 
    <div id="results"></div> 

Demonstration

समस्या इस तरह की इनलाइन फ़ंक्शन कॉल से बचने के लिए एक और कारण है। एक पसंदीदा तरीका होगा

<form name="form1"> 
     <input type="button" value="Check" id=check> 
     <input type="button" value="Reset" id=reset> 
</form> 
<div id="results"></div> 
<script type="text/javascript"> 
     document.getElementById("reset").onclick = function() { 
      document.getElementById("results").innerHTML = ""; 
     } 
     document.getElementById("check").onclick = function(){ 
      document.getElementById("results").innerHTML = "foo"; 
     } 
</script> 
+1

यह '(इस) के साथ (इस)/* ऑनक्लिक विधि */'के साथ है –