जावास्क्रिप्ट का उपयोग कर लेबल टेक्स्ट बदलें


90

मेरे लिए निम्न कार्य क्यों नहीं है?

<script>
    document.getElementById('lbltipAddedComment').innerHTML = 'Your tip has been submitted!';
</script>
<label id="lbltipAddedComment"></label>

1
उफ़! खेद है कि 'नहीं होना चाहिए'; 0
फिल क्रो

4
क्योंकि जब आप स्क्रिप्ट लेबल इनरहेटलएम बदलने की कोशिश करते हैं, तो lbltipAddedComment वास्तव में पृष्ठ पर मौजूद नहीं होता है। लेबल या उपयोग jQuery $ (दस्तावेज़) के बाद स्क्रिप्ट .ready () सम्मिलित करें
एंड्रयू Orsich

क्षमा करें, संपादन बटन नहीं देखा!
फिल क्रो

मैंने यहाँ सब कुछ सुझाया, लेकिन मेरे लिए कुछ भी काम नहीं किया।
राजन मिश्र

जवाबों:


137

क्योंकि आपकी स्क्रिप्ट पहले से चल रही है, इसलिए लेबल पृष्ठ पर (DOM में) मौजूद है। या तो स्क्रिप्ट को लेबल के बाद डालें, या तब तक प्रतीक्षा करें जब तक कि दस्तावेज़ पूरी तरह से लोड न हो जाए (एक ओनलॉड फ़ंक्शन का उपयोग करें, जैसे jQuery ready()या http://www.webreference.com/programming/javascript/onloads/ )

यह काम नहीं करेगा:

<script>
  document.getElementById('lbltipAddedComment').innerHTML = 'your tip has been submitted!';
</script>
<label id="lbltipAddedComment">test</label>

यह काम करेगा:

<label id="lbltipAddedComment">test</label>
<script>
  document.getElementById('lbltipAddedComment').innerHTML = 'your tip has been submitted!';
</script>

यह उदाहरण (jsfiddle लिंक) ऑर्डर को बनाए रखता है (स्क्रिप्ट पहले, फिर लेबल) और एक ऑनलोड का उपयोग करता है:

<label id="lbltipAddedComment">test</label>
<script>
function addLoadEvent(func) {  
      var oldonload = window.onload;  
      if (typeof window.onload != 'function') {  
        window.onload = func;  
      } else {  
        window.onload = function() {  
          if (oldonload) {  
            oldonload();  
          }  
          func();  
        }  
      }  
    }  

   addLoadEvent(function() {  
document.getElementById('lbltipAddedComment').innerHTML = 'your tip has been submitted!';

    });  
</script>

मुझे लगता है कि .textContent का उत्तर वास्तव में सही है
पॉल टेलर

1
खैर @PaTTaylor, यह जवाब यहां 2010 से है और इसमें 92 अपवोट्स (और अब, आपके डाउनवोट) हैं। प्रश्न का उपयोग इनर HTML किया गया था, इसलिए मैंने केवल वही बदला जो उसके कोड को प्राप्त करने के लिए आवश्यक था। जबकि मुझे लगता है कि अतिरिक्त विचारों का सुझाव देना हमेशा ठीक होता है ("अरे, बीडब्ल्यूटी, इनरहैम / इनरटेक्स्ट के बजाय टेक्स्टकंटेंट का उपयोग करें), यह ओपी की समस्या नहीं थी ...
डाउनवोट

ठीक है, लेकिन क्या उसने कभी अपनी अंतिम टिप्पणी पर काम किया है कि कुछ भी काम नहीं किया गया था, इसलिए यह मेरी समझ थी कि आपका समाधान काम नहीं करता है, मेरे लिए प्रमाणित काम नहीं करता है , इस jsfiddle.net/cfxrLpe9/4 को पाठ के साथ काम करता दिखता है। लेकिन इनरहेटलमीम, क्यों नहीं है? उस ?
पॉल टेलर

@PaTTaylor उत्तर ने संभवतः ओपी के लिए काम किया क्योंकि उन्होंने इस उत्तर को स्वीकार किया। आपके पास अपने कोड में एक टाइपो है। आप जवाब दिखाने के लिए इनरएचटीएमएल के बजाय इनरएचटीएमएल का उपयोग कर रहे हैं। jsfiddle.net/cfxrLpe9/6
Randall Flagg

22

क्या आपने कोशिश की .innerTextया .valueइसके बजाय .innerHTML?


.innerText लेबल के लिए काम करता है। मेरे पास <head> के भीतर Script टैग है और <body> में डिज़ाइन है। आखिरकार यह मेरे लिए ठीक काम करता है।
जय

@AshwinG आपकी टिप्पणी ने मुझे बचा लिया। मैं अपने सिर के .valueलिए पिटाई कर रहा थाlabel
Prbs

उपयोग करने के लिए प्रयास करें.text('Your Text')
डरपोक

15

क्योंकि स्क्रिप्ट निष्पादित होने पर लेबल तत्व लोड नहीं होता है। लेबल और स्क्रिप्ट तत्वों को स्वैप करें, और यह काम करेगा:

<label id="lbltipAddedComment"></label>
<script>
    document.getElementById('lbltipAddedComment').innerHTML = 'Your tip has been submitted!';
</script>

1
ओह, ध्यान नहीं दिया! हां, यदि पोस्ट किया गया कोड वास्तविक कोड से प्रतिबिंबित होता है (डॉक्यूमेंट पर आग लगाने के लिए jquery का उपयोग नहीं कर रहा है। पहले से या इसी तरह) तो यह एक कारण है कि यह भी काम नहीं करेगा।
गॉर्डन डे

9

.textContentइसके बजाय उपयोग करें ।

मैं एक लेबल के मूल्य को बदलने के साथ ही संघर्ष कर रहा था, जब तक कि मैंने यह कोशिश नहीं की।

यदि यह ऑब्जेक्ट के निरीक्षण के प्रयास को हल नहीं करता है, तो यह देखने के लिए कि आप console.dirइस प्रश्न पर दिखाए गए कंसोल के साथ इसे लॉग इन करके क्या गुण सेट कर सकते हैं : मैं जावास्क्रिप्ट तत्व के रूप में HTML तत्व कैसे लॉग कर सकता हूं?


धन्यवाद। मुझे संदेह है (लेकिन सख्ती से पुष्टि नहीं की गई है) कि मेरा उपयोग-मामला उस प्रश्न के समान है: मैं एक लेबल के पाठ को पुनः प्राप्त करने और / या बदलने की कोशिश कर रहा था जिसमें एक नेस्टेड इनपुट तत्व है, जैसे मैं पुनः प्राप्त करना चाहता था और / या "enter info here:"निम्नलिखित के हिस्से को बदलें <label id='myLabel'>enter info here:<input type='text' id='inp'/></label>:। केवल .textContentकाम किया, और से कोई भी .innerHTML, .innerTextया .valueकाम किया। (डिस्क्लेमर: मैंने केवल क्रोम में जाँच की है।)
एंड्रयू विल्म्स ३१'१

थैंक्यू मैंने उसी समस्या को मारा
पॉल टेलर

2
@AndrewWillems दुर्भाग्य .textContentसे .innerText( और पढ़ने के लिए ठीक है), लिखने के लिए मेरे फ़ायरफ़ॉक्स 60 के लिए काम नहीं किया (यह भी एम्बेडेड इनपुट फ़ील्ड को मिटा दिया, जैसे .innerHTML)। इसलिए मुझे इसका सहारा लेना पड़ा document.getElementById('myLabel').childNodes[0].nodeValue="new label text"(बेशक, इंडेक्स कुछ और हो सकता है फिर 0, जो बनाता है थोड़ा कमज़ोर है लेकिन मेरे लिए काम किया है)
मतिजा नालिस

8

.innerTextकाम करना चाहिए।

document.getElementById('lbltipAddedComment').innerText = 'your tip has been submitted!';


0

इसे इस्तेमाल करे:

<label id="lbltipAddedComment"></label>
<script type="text/javascript"> 
      document.getElementById('<%= lbltipAddedComment.ClientID %>').innerHTML = 'your tip has been submitted!';
</script>

1
किसी समाधान का लिंक स्वागत योग्य है, लेकिन कृपया सुनिश्चित करें कि आपका उत्तर इसके बिना उपयोगी है: लिंक के चारों ओर संदर्भ जोड़ें ताकि आपके साथी उपयोगकर्ताओं को यह पता चले कि यह क्या है और यह क्यों है, तो पृष्ठ के सबसे प्रासंगिक हिस्से को उद्धृत करें ' लक्ष्य पृष्ठ अनुपलब्ध होने की स्थिति में पुनः लिंक करना। ऐसे लिंक जो किसी लिंक से बहुत कम हैं उन्हें हटाया जा सकता है।
पेपर ११११

0

क्योंकि स्क्रिप्ट पहले निष्पादित हो जाएगी .. जब स्क्रिप्ट निष्पादित हो जाएगी, उस समय नियंत्रण लोड नहीं हो रहे हैं। इसलिए लोडिंग नियंत्रण के बाद आप एक स्क्रिप्ट लिखते हैं।

यह काम करेगा।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.