setAttribute, onClick और क्रॉस ब्राउज़र संगतता

Question

मैंने इसके बारे में कई पोस्ट पढ़ी हैं लेकिन कोई ठोस जवाब नहीं है।

// button creation 
onew = document.createElement('input'); 
onew.setAttribute("type", "button"); 
onew.setAttribute("value", "hosts"); 
onew.onclick = function(){fnDisplay_Computers("'" + alines[i] + "'"); }; // ie 
onew.setAttribute("onclick", "fnDisplay_Computers('" + alines[i] + "')"); // mozilla 
odiv.appendChild(onew); 

अब, setAttribute() विधि (मोज़िला टिप्पणी के साथ) mozilla में ठीक काम करता है, लेकिन केवल यह इसके ऊपर पंक्ति के बाद आता है: यहाँ मेरी कोड है। तो दूसरे शब्दों में यह जो भी अंतिम सेट हो जाता है, वह सिर्फ डिफ़ॉल्ट लगता है। .onclick विधि (यानी टिप्पणी के साथ) किसी भी मामले में काम नहीं करता है, क्या मैं इसे गलत तरीके से उपयोग कर रहा हूं?

किसी भी तरह से मैं आईई में यह काम करने के लिए कोई रास्ता नहीं ढूंढ सकता, दोनों में अकेले रहने दो। मैंने .onclick विधि का उपयोग करते समय फ़ंक्शन कॉल को बदल दिया और यह एक चेतावनी फ़ंक्शन के लिए केवल एक साधारण कॉल का उपयोग करके ठीक काम किया, यही कारण है कि मेरा मानना ​​है कि मेरा वाक्यविन्यास गलत है।

लंबी कहानी छोटी, मुझे आईई/मोज़िला के बीच लगातार काम करने के लिए ऑनक्लिक पैरामीटर नहीं मिल सकता है।

- निकोलस

Answer 1

मैं आमतौर पर की तरह कुछ का उपयोग करें।

Answer 2

उपयोग मोज़िला आधारित ब्राउज़र के लिए type तर्क के लिए "click", और "onclick" के साथ attachEvent() समारोह के साथ addEventListener() समारोह IE के लिए sEvent तर्क के रूप में; मैं यह सबसे अच्छा उदाहरण के लिए आज़माएं/कैच कथन का उपयोग करने के लिए, लगता है: इस आईई ई फ़ायरफ़ॉक्स में दोनों काम करना चाहिए

onew.onclick = new Function("fnDisplay_Computers('" + alines[i] + "')"); 

:

try { 
    onew.attachEvent("onclick", //For IE 
        function(){fnDisplay_Computers("'" + alines[i] + "'"); }); 
} 
catch(e) { 
    onew.addEventListener("click", //For Mozilla-based browsers 
        function(){fnDisplay_Computers("'" + alines[i] + "'"); }, 
        false); 
} 

Answer 3

onew.setAttribute ("टाइप", "बटन");

HTML दस्तावेज़ों पर setAttribute का कभी भी उपयोग न करें। आईई यह बुरी तरह से कई मामलों में गलत हो जाता है, और डोम-एचटीएमएल गुण अपेक्षाकृत कम होता है, तेज और आसान को पढ़ने के लिए:

onew.type= 'button'; 

onew.onclick = function() {fnDisplay_Computers (" '" + alines [i ] + "'"); }; // यानी

'alines' क्या है? क्यों आप इसे एक स्ट्रिंग को बदलने और एकल उद्धरण के साथ इसके आसपास रहे हैं? ऐसा लगता है कि आप कुछ जघन्य एक स्ट्रिंग में कोड का मूल्यांकन (जो कि तुम क्या 'onew.setAttribute के संस्करण में नीचे कर रहे है) को शामिल करने के लिए कोशिश कर रहे हैं। तारों में जावास्क्रिप्ट कोड का मूल्यांकन करना लगभग हमेशा गलत बात है; प्लेग की तरह इसे टालें। उपरोक्त मामले में, IE और Firefox के रूप में एक ही करना चाहिए: यह काम नहीं करना चाहिए।

यदि 'alines [i]' एक स्ट्रिंग है, तो मुझे लगता है कि आप जो करने का प्रयास कर रहे हैं, उसे याद है कि कोड स्ट्रिंग का निर्माण करके स्ट्रिंग को याद किया जाएगा जो जावास्क्रिप्ट में मूल स्ट्रिंग में मूल्यांकन करेगा। लेकिन:

"'" + alines[i] + "'" 

अपर्याप्त है। क्या होगा यदि 'alines [i]' में एपोस्ट्रोफ़ी, या एक बैकस्लैश है?

'O'Reilly' 

आपके पास एक वाक्यविन्यास त्रुटि और संभावित सुरक्षा छेद है।अब, आप कुछ श्रमसाध्य और कष्टप्रद की तरह कर सकता है:

"'" + alines[i].split('\\').join('\\\\').split("'").join("\\'") + "'" 

स्ट्रिंग भागने की कोशिश करने के लिए है, लेकिन यह बदसूरत है और अन्य डेटाटाइप्स के लिए काम नहीं करेगा। तुम भी आप के लिए यह करने के लिए जावास्क्रिप्ट पूछ सकते:

uneval(alines[i]) 

लेकिन सभी वस्तुओं भी जावास्क्रिप्ट स्रोत तार evaluatable लिए परिवर्तित किया जा सकता है; मूल रूप से संपूर्ण दृष्टिकोण विफलता के लिए बर्बाद हो गया है।

सामान्य बात करता है, तो आप सिर्फ onclick कॉलबैक एक पैरामीटर के साथ एक समारोह कॉल करना चाहते करने के लिए सरल तरीके से कोड लिखने के लिए:

onew.onclick= function() { 
    fnDisplay_Computers(alines[i]); 
}; 

आम तौर पर यह काम करते हैं और आप क्या चाहते है । हालांकि, यहां एक मामूली झुर्रियां है जो आपने यहां मारा हो सकता है, जो आपको तारों के साथ निराशाजनक दृष्टिकोण पर विचार करने में भ्रमित कर सकता है।

अर्थात्, यदि इस मामले में 'मैं' लूप के लिए एक संलग्न 'चर का चर है, तो' alines [i] 'का संदर्भ ऐसा नहीं करेगा जो आपको लगता है। जब क्लिक होता है तो 'i' को कॉलबैक फ़ंक्शन द्वारा एक्सेस किया जाएगा - के बाद लूप समाप्त हो गया है। इस बिंदु पर 'i' वैरिएबल को लूप के अंत में जो भी मूल्य था, उसके साथ छोड़ा जाएगा, इसलिए 'alines' i 'हमेशा' alines 'का अंतिम तत्व होगा, भले ही' ओन्यू 'पर क्लिक किया गया हो।

(जैसे देखें। How to fix closure problem in ActionScript 3 (AS3) इस में से कुछ चर्चा के लिए। यह दोनों जावास्क्रिप्ट और अजगर में बंद के साथ भ्रम की सबसे बड़ा कारण है, और वास्तव में कुछ दिन एक भाषा के स्तर पर किया जाना चाहिए।)

आप कर सकते हैं अपनी ही समारोह में बंद encapsulating, इस तरह से पाश समस्या को हल मिलता है:

function callbackWithArgs(f, args) { 
    return function() { f.apply(window, args); } 
} 

// ... 

onew.onclick= callbackWithArgs(fnDisplay_Computers, [alines[i]]); 

और जावास्क्रिप्ट के बाद के संस्करण में, आप बस कहने के लिए सक्षम हो जाएगा:

onew.onclick= fnDisplay_Computers.bind(window, alines[i]); 

आप ब्राउज़रों में आज Function.bind() 'उपयोग करने में सक्षम होना चाहते हैं, तो आप Prototype ढांचे से एक क्रियान्वयन प्राप्त कर सकते हैं, या बस का उपयोग करें:

if (!('bind' in Function.prototype)) { 
    Function.prototype.bind= function(owner) { 
     var that= this; 
     var args= Array.prototype.slice.call(arguments, 1); 
     return function() { 
      return that.apply(owner, 
       args.length===0? arguments : arguments.length===0? args : 
       args.concat(Array.prototype.slice.call(arguments, 0)) 
      ); 
     }; 
    }; 
} 

Answer 4

मुझे लगता है कि # 3 protesteth बहुत ज्यादा । कई स्थितियों में मैं गतिशील रूप से एक टेबल बना रहा हूं और कॉलबैक फ़ंक्शन पर पैरामीटर पास करने की आवश्यकता है। यह टाइपएफ़ समस्या नहीं है क्योंकि मेरा चरम पार्म प्रश्न में तालिका पंक्ति में एक पूर्णांक सूचकांक है। यहाँ है कि क्रॉस-ब्राउज़र अनुरूप हो रहा है दोनों एक चर और निश्चित पैरामीटर के साथ कोड है:

for (i = 0; i < arrTableData.length; i++) { 
    eleTR = objTable.insertRow(i + 1); 
    cell = eleTR.insertCell(0); 
    cell.width = "21"; 
    var myElement = document.createElement('img'); 
    myElement.setAttribute('src', 'images/button_down.gif'); 
    myElement.setAttribute('alt', 'Move item down'); 
    myElement.onclick = new Function('moveItem(' + i + ',0)'); 
    cell.appendChild(myElement); 
}