मैं जेएस में नौसिखिया हूँ। मुझे एक समस्या से समस्या है। मैं विशेषताओं को सेट करने के लिए अपने पैराराफ पर अपने फ़ंक्शन का उपयोग करना चाहता हूं ..

<body>
<p id=1>Paragraph 1</p>
<p id=2>Paragraph 2</p>
<p id=3>Paragraph 3</p>
</body>

<script>
function myFunction(id) {
    document.getElementById(id).style.color = "green";
}
initAll();
function initAll() {
    var elements = document.getElementsByTagName('p');
    var n;
    for (n = 0; n < elements.length; ++n) {
        elements[n].setAttribute("onclick", "myFunction(%d)", n);
    }

}
</script>

आउटपुट में मेरे पास ऐसा कुछ है: output

मैं चर n के संदर्भ प्रदान नहीं कर सकता।

शायद गुण सेट करने का कोई बेहतर तरीका है?

-1
RichieSambora 21 नवम्बर 2021, 14:22
आप स्प्रिंटफ-जैसी प्रारूप स्ट्रिंग्स के यहां काम करने की अपेक्षा क्यों करते हैं...? यह मेरे लिए स्पष्ट नहीं है कि आपको यह विचार कैसे मिला, मुझे ऐसा कोई प्रमाण नहीं दिखाई देता जो कभी भी setAttribute द्वारा समर्थित हो। कृपया आपके द्वारा उपयोग किए जाने वाले प्रत्येक फ़ंक्शन/विधि के दस्तावेज़ देखें कि यह कैसे काम करता है (और यह कैसे नहीं करता है)। मुझे लगता है कि console लॉगिंग फ़ंक्शन ही इस तरह के एकमात्र तरीके हैं।
 – 
CherryDT
21 नवम्बर 2021, 14:36

3 जवाब

सबसे बढ़िया उत्तर

जो मैं समझता हूं उससे आप प्रत्येक p तत्व पर एक ईवेंट श्रोता (क्लिक ईवेंट के लिए) संलग्न करना चाहते हैं और तत्वों पर क्लिक करते समय उस फ़ंक्शन को निष्पादित करना चाहते हैं।

इवेंट लिस्टनर को किसी एलीमेंट पर अटैच करने के लिए आप addEventListener

आईडी प्राप्त करने और इसे अपने फ़ंक्शन के लिए एक परम के रूप में पास करने के लिए आप गेटएट्रिब्यूट

आप var के बजाय const और let का भी उपयोग कर सकते हैं। यहां पढ़ें -> var vs let या यहां var let const

function myFunction(id) {

    document.getElementById(id).style.color = "green";
}

function initAll() {
    const elements = document.getElementsByTagName('p');

    for (let n = 0; n < elements.length; ++n) {
        const elementId = elements[n].getAttribute("id")
        elements[n].addEventListener("click", function(){
            myFunction(elementId)
        });
    }
}
initAll() 
<p id=1>Paragraph 1</p>
<p id=2>Paragraph 2</p>
<p id=3>Paragraph 3</p>
1
Mihai T 21 नवम्बर 2021, 14:33
.getAttribute - मुझे बस इसकी जरूरत थी। शुक्रिया :)
 – 
RichieSambora
21 नवम्बर 2021, 14:54

आप अपने अनुच्छेद तत्वों के लिए onclick विशेषता सेट करने का प्रयास कर रहे हैं और उन्हें अपने myFunction को असाइन कर रहे हैं।

चूंकि आपकी आईडी 1 से शुरू होती हैं, इसलिए आपको for लूप के बॉडी के अंदर (n + 1) लिखना होगा (लूप वैरिएबल n 0 से शुरू होता है)

Javascript में, C की तरह कोई स्वरूपण विनिर्देशक (%d) उपलब्ध नहीं हैं। तो आप बस + ऑपरेटर का उपयोग करके स्ट्रिंग कॉन्सटेनेशन करें।

तो, रेखा होनी चाहिए,

for (var n = 0; n < elements.length; ++n) {
   var index = n + 1;
   elements[n].setAttribute("onclick", "myFunction(" + index + ")");
}

यह अब ठीक काम करेगा।

लेकिन यह ऐसा तरीका नहीं है जिसका उपयोग लोग जावास्क्रिप्ट में ईवेंट श्रोताओं को जोड़ने के लिए करते हैं। मैं एमडीएन में forEach और addEventListener विधियों की जांच करने की सलाह देता हूं।

https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

0
Hari Ram 21 नवम्बर 2021, 14:40

1- HTML IDs संख्याओं से शुरू नहीं हो सकते।

<p id=myID1>Paragraph 1</p>

2- स्ट्रिंग को n से जोड़ें

"" + (n+1) + ""

3- चूंकि ID एक string है, इसलिए आपको इसे सिंगल कोट्स के अंदर बंद करना होगा

"myFunction('myID" + (n+1) + "')"
function myFunction(id) {
  document.getElementById(id).style.color = "green";
}

function initAll() {
  var elements = document.getElementsByTagName('p');
  var n;
  for (n = 0; n < elements.length; ++n) {
    elements[n].setAttribute("onclick", "myFunction('myID" + (n+1) + "')");
  }
}

initAll();
<body>
  <p id=myID1>Paragraph 1</p>
  <p id=myID2>Paragraph 2</p>
  <p id=myID3>Paragraph 3</p>
</body>
0
Baro 21 नवम्बर 2021, 14:36
आईडी की शुरुआत नंबरों से क्यों नहीं हो सकती है? जब आप टेम्प्लेट स्ट्रिंग्स का उपयोग कर सकते हैं तो क्यों संयोजित करें?
 – 
Mihai T
21 नवम्बर 2021, 14:46
आपका बहुत बहुत धन्यवाद। यह अच्छी तरह से काम करता है :)
 – 
RichieSambora
21 नवम्बर 2021, 14:51
आईडी HTML4 में संख्याओं से शुरू नहीं हो सकती है, लेकिन वास्तव में HTML5 में जाँच करना अब कोई समस्या नहीं है। और एक संयोजित स्ट्रिंग क्यों नहीं, यह वरीयता है।
 – 
Baro
21 नवम्बर 2021, 15:10