2012-12-07 27 views
8

का उपयोग कैसे करें मैं एक स्क्रिप्ट बना रहा था जो हर बार बटन दबाए जाने पर div तत्व बनाता है। मूल रूप से मैं समारोह onclick विशेषता के साथ इनलाइन कहा जाता था, लेकिन जैसे कि इसलिए मैं इसे बाहर ले जाया गया और इसके बजाय addEventListener("click",function());addEventListener

उपयोग करने के लिए मैंने पहले तो मैं भी यकीन है कि मैं कर रहा हूँ नहीं कर रहा हूँ addEventListener() उपयोग नहीं किया है की कोशिश की jslint नहीं है इसे सही ढंग से उपयोग कर रहा है।

समस्या यह है कि यह पृष्ठ div बनाता है जब पृष्ठ लोड होता है और बटन दबाए जाने पर कुछ भी नहीं करेगा।

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

input.addEventListener("click", function(){ 
    createEntry(document.getElementById('a').value); 
}); 

तरह

<body> 
<form> 
    <textarea id="a"></textarea>  
    <br> 
    <input value="button" type="button"> 
</form> 
<div id="content"> 
</div> 
<script> 
    /*jslint browser:true */ 
    function createEntry(text) { 
     "use strict"; 

     var div = document.createElement("div"); 
     div.setAttribute("class", "test"); 
     document.getElementById("content").appendChild(div); 
    } 
    var input = document.getElementsByTagName("input")[0]; 
    input.addEventListener("click", createEntry(document.getElementById('a').value)); 
</script> 

उत्तर

11

परिवर्तन ईवेंट श्रोता के रूप में यह खड़ा है, तो आप एक घटना श्रोता के रूप में createEntry का परिणाम गुजर रहे हैं:

यहाँ मैं क्या है , फ़ंक्शन स्वयं

अधिक जानकारी यहां:

https://developer.mozilla.org/en/docs/DOM/element.addEventListener

+0

आह! आपका समय देने के लिए आपका बहुत बहुत धन्यवाद। :] –

6

बदलें इस लाइन

input.addEventListener("click", createEntry(document.getElementById('a').value)); 

input.addEventListener("click", function(){ 
createEntry(document.getElementById('a').value); 
}); 
+0

आपके समय के लिए धन्यवाद। :] –

4

में घटना से निपटने और डोम हेरफेर के लिए jQuery की तरह एक JavaScript लाइब्रेरी का उपयोग, ब्राउज़र सुरक्षित और एकरूपता के लिए हो सकता है की कोशिश करें।

आपको निम्न रूप jQuery में ईवेंट हैंडलर्स का उपयोग कर सकते हैं:

$(<element_selector>).on("click", function (event) { 
    // your code here... 
}); 
+2

मुझे पता था कि JQuery के साथ इसे कैसे किया जाए, लेकिन मैं इसके बिना लिखकर अपने जावास्क्रिप्ट कौशल को बेहतर बनाना चाहता था। हालांकि, आप क्रॉस ब्राउज़र सुरक्षा के बारे में एक अच्छा मुद्दा लाते हैं। धन्यवाद :] –