jQuery के साथ एक विशिष्ट div में सभी इनपुट फ़ील्ड को कैसे साफ़ करें?

Question

मैं एक साधारण चीज़ करने के लिए jQuery का उपयोग करने की कोशिश कर रहा हूं: जब भी फॉर्म लोड होता है, तो इनपुट के क्षेत्र के इनपुट फ़ील्ड के इनपुट फ़ील्ड को साफ़ करें, या यदि उपयोगकर्ता पिकलिस्ट बदलता है; लेकिन मुझे चयन करने के लिए चयनकर्ता प्राप्त करने में एक समय का शैतान है।

सबसे पहले, यहाँ मेरी onclick है और ऑनलोड से चलाता है:

<form name="EditGenotype" action="process_GenotypeMaint.php" method="POST" onsubmit="return false" onload=clear_fetch() > 

और picklists पर:

<SELECT multiple size=6 NAME="marker" onchange=show_marker() onclick=clear_fetch() > 

इसके बाद, यहाँ div में मेरी HTML इनपुट तत्व है मैं साफ करना चाहते:

<div class=fetch_results> 
     <fieldset> 
    <LEGEND><b>Edit Genotype, call 1</b></LEGEND> 
     <boldlabel>Allele_1</boldlabel><input id=allele_1_1 name=allele_1_1 size=5 > 
     <boldlabel>Allele_2</boldlabel><input id=allele_1_2 name=allele_1_2 size=5 > 
     <boldlabel>Run date</boldlabel><input id=run_date1 name=run_date1 size=10 disabled=true> 
     </fieldset> 
     <fieldset> 
    <LEGEND><b>Edit Genotype, call 2</b></LEGEND> 
     <boldlabel>Allele_1</boldlabel><input id=allele_2_1 name=allele_2_1 size=5 > 
     <boldlabel>Allele_2</boldlabel><input id=allele_2_2 name=allele_2_2 size=5 > 
     <boldlabel>Run date</boldlabel><input id=run_date2 name=run_date2 size=10 disabled=true> 
     </fieldset> 
     <fieldset> 
    <LEGEND><b>Edit Genotype, call 3</b></LEGEND> 
     <boldlabel>Allele_1</boldlabel><input id=allele_3_1 name=allele_3_1 size=5 > 
     <boldlabel>Allele_2</boldlabel><input id=allele_3_2 name=allele_3_2 size=5 > 
     <boldlabel>Run date</boldlabel><input id=run_date3 name=run_date3 size=10 disabled=true> 
     </fieldset> 
    </div> 

अंत में, मेरी स्क्रिप्ट यहां है:

function clear_fetch() {  

    $('#fetch_results:input', $(this)).each(function(index) { 
     this.value = ""; 
    }) 

    } 

हालांकि, कुछ नहीं होता ... इसलिए, मेरे पास चयनकर्ता सही नहीं होना चाहिए। क्या कोई देखता है कि मैंने क्या गलत किया है?

Answer 1

फिडल:http://jsfiddle.net/simple/BdQvp/

तुम इतनी है कि यह कर सकते हैं:

मैं वर्णन करने के लिए कैसे आप बटन के माध्यम से उन इनपुट फ़ील्ड में डालने या स्पष्ट मूल्यों कर सकते हैं फिडल में दो बटन जोड़ लिया है। आप पर क्लिक करें ईवेंट पर क्लिक करें और फ़ंक्शन को कॉल करें।

//Fires when the Document Loads, clears all input fields 
$(document).ready(function() { 
    $('.fetch_results').find('input:text').val('');  
}); 

//Custom Functions that you can call 
function resetAllValues() { 
    $('.fetch_results').find('input:text').val(''); 
} 

function addSomeValues() { 
    $('.fetch_results').find('input:text').val('Lala.'); 
} 

अद्यतन:

चेक बाहर this great answer below by Beena के रूप में अच्छी तरह से एक अधिक सार्वभौमिक दृष्टिकोण के लिए।

Answer 2

जोड़े जो मुद्दे मैं देखता हूं। fetch_results एक वर्ग है, आईडी नहीं है और प्रत्येक फ़ंक्शन सही नहीं दिखता है।

$('.fetch_results:input').each(function() { 
     $(this).val(''); 
}); 

बस इतना ध्यान रखें कि यदि आप रेडियो के साथ अंत या बटन की जाँच करें, आप जाँच की विशेषता, नहीं मान साफ़ करना होगा सुनिश्चित करें।

Answer 3

बदलें इस:

<div class=fetch_results> 

इस के लिए:

<div id="fetch_results"> 

तो निम्नलिखित काम करना चाहिए:

$("#fetch_results input").each(function() { 
     this.value = ""; 
    })​ 

http://jsfiddle.net/NVqeR/

Answer 4

आप एक वर्ग के साथ रहना चाहती हैं स्तर एस निर्वाचक तो आप (Mahn से एक ही jfiddle का प्रयोग करके) कुछ इस तरह कर सकता है

$("div.fetch_results input:text").each(function() { 
    this.value = "testing"; 
})​ 

यह एक fetch_results वर्ग के साथ div के भीतर ही पाठ इनपुट बॉक्स का चयन होगा।

किसी भी jQuery के साथ यह करने का यह एक तरीका है। इस सवाल पर 10 jQuery लोगों से पूछें और आपको 12 उत्तरों मिलेंगे।

Answer 5

इस फ़ंक्शन का उपयोग रेडियो बटन, चेक-बॉक्स, चयन, एकाधिक चयन, पासवर्ड, टेक्स्ट, टेक्स्टरेरा, फ़ाइल सहित फ़ॉर्म में सभी तत्वों को साफ़ करने के लिए किया जाता है।

function clear_form_elements(class_name) { 
    jQuery("."+class_name).find(':input').each(function() { 
    switch(this.type) { 
     case 'password': 
     case 'text': 
     case 'textarea': 
     case 'file': 
     case 'select-one': 
     case 'select-multiple': 
     case 'date': 
     case 'number': 
     case 'tel': 
     case 'email': 
      jQuery(this).val(''); 
      break; 
     case 'checkbox': 
     case 'radio': 
      this.checked = false; 
      break; 
    } 
    }); 
} 

Answer 6

https://stackoverflow.com/a/10892768/2087666 से प्रेरित है, लेकिन मैं एक वर्ग के बजाय का भी उपयोग कर और अगर पसंद करते हैं स्विच ओवर:

function clearAllInputs(selector) { 
    $(selector).find(':input').each(function() { 
    if(this.type == 'submit'){ 
      //do nothing 
     } 
     else if(this.type == 'checkbox' || this.type == 'radio') { 
     this.checked = false; 
     } 
     else if(this.type == 'file'){ 
     var control = $(this); 
     control.replaceWith(control = control.clone(true)); 
     }else{ 
     $(this).val(''); 
     } 
    }); 
} 

यह किसी भी चयनकर्ता के अंदर लगभग सभी इनपुट का ध्यान रखना चाहिए।

Answer 7

$.each($('.fetch_results input'), function(idx, input){ 
    $(input).val(''); 
});