jQuery.val() <input> टैग

Question

इनपुट में कुछ टाइप करने के बाद, और बटन पर क्लिक करने पर काम नहीं करता है, ".val()" खाली मूल्य लौटाता है, कोई विचार क्यों?

एचटीएमएल कोड:

<div class="mainClass"> 
    <div class="class1" > 
     <div class="class2"> 
     <h3>Settings 1</h3> 
     <label> 
      <span>Text 1:</span> 
      <input type="text" name="text"> 
     </label> 
     <label> 
      <span>Text 2:</span> 
      <input type="text" name="text2"> 
     </label> 
     </div> 
    </div> 

    <div class="class3" > 
     <div class="class4"> 
     <h3>Settings 2</h3> 
     <label> 
      <span>Text 1:</span> 
      <input type="text" name="text"> 
     </label> 
     <label> 
      <span>Text 2:</span> 
      <input type="text" name="text2"> 
     </label> 
     </div> 
    </div> 
</div> 
<button id="Go" class="go" >GO </button> 

Javascript कोड:

$('#Go').on('click', function() { 
    alert($('.class1 input').val()); //return an empty value 
    $('.class1 input').val("test"); 
    alert($('.class1 input').val()); //return test 
}); 

संपादित करें:

यहां तक ​​कि यह does not काम, और यहाँ मैं केवल एक ही इनपुट तो मैं में टाइप नहीं कर सकते है गलत:

<div class="mainClass"> 
    <div class="class1" > 
     <div class="class2"> 
     <h3>Settings 1</h3> 
     <label> 
      <span>Text 1:</span> 
      <input type="text" name="text"> 
     </label>   
     </div> 
    </div> 
</div> 
<button id="Go" class="go" >GO </button> 

संपादित करें 2: मैं समस्या का एक शुरुआत ...

जब मैं कर रहा हूँ में पाया गया कि:

text value: 
text value:myinputText  

तो दो बनाया:

$('.class1 input').each(function() { 
    alert($(this).attr('name') + " value:" +$(this).val()); 
}); 

मैं इस तरह दो "अलर्ट" से मिलता है मेरे एचटीएमएल में से एक के लिए, पहला खाली है और दूसरा एक अच्छा काम करता है! मेरे पृष्ठ पर बारीकी से देखकर, मैंने पाया कि सभी तत्व डुप्लिकेट किए गए हैं (<select,field, input...)

कोई विचार यह कैसे संभव है? क्या मैं अपनी एचटीएमएल फाइल दो बार बुला रहा हूँ? और यह सब मेरी कोड एक पॉपअप में है (मैं अगर यह मदद कर सकते हैं पता नहीं है) (मैं जावास्क्रिप्ट और jQuery में नया हूँ)

धन्यवाद

Answer 1

वहाँ एक से अधिक '.class1 input' मिलान तत्व है। आप शायद सेट के पहले एक को भर नहीं पाए।

the documentation से:

मिलान किया तत्वों के सेट में पहला तत्व के वर्तमान मूल्य प्राप्त करें।

जबकि val('text') मिलान करने वाले सभी तत्वों को भर देता है:

मिलान किया तत्वों

के सेट में प्रत्येक तत्व का मान निर्धारित है यही वजह है कि आप अपने दूसरे चेतावनी में कुछ देखते हैं।

आप बेहतर चयनकर्ता चयनकर्ता का बेहतर उपयोग करेंगे। आम तौर पर हम किसी आईडी या नाम का उपयोग करते हैं यदि किसी फॉर्म को किसी सर्वर को मान भेजने के लिए उपयोग किया जाता है।

Answer 2

आपके पास एक से अधिक तत्व हैं जो मेल खाते हैं।

jQuery docs

.val()

से मिलान किया तत्वों के सेट में पहला तत्व के वर्तमान मूल्य प्राप्त करें या हर मिलान किया तत्व का मान निर्धारित किया है।

आपको केवल मिलान स्थिति के रूप में मिलान किए गए सेट का पहला तत्व प्राप्त हो रहा है। यदि आप सभी मान चाहते हैं, तो आपको सेट पर लूप करना होगा।

Answer 3

$('.class1 input').val() 

दो तत्वों

<input type="text" name="text"> 

और

<input type="text" name="text2"> 

Answer 4

को संदर्भित करता है एक दस्तावेज तैयार ब्लॉक के चारों ओर अपने Jquery कोड लपेटें:

$('document').ready(function(){}); 

तरह ओ:

$('document').ready(function(){ 
    $('#Go').on('click', function() { 
     alert($('.class1 input').val()); //return an empty value 
     $('.class1 input').val("test"); 
     alert($('.class1 input').val()); //return test 
    }); 
}); 

यहां तक ​​कि Google खोज और स्टैक ओवरफ्लो से बहुत मदद के साथ, हमें इस समस्या की पहचान करने में 1 घंटा लग गए।