Jquery चयनकर्ता इनपुट [प्रकार = पाठ] ')

98

मैंने एक कोड लिखा है जो मूल रूप से input type=textइस तरह से सभी तत्व का चयन करता है :

$('.sys input[type=text]').each(function () {}

मैं इसे कैसे चुनूं input[type=text]या कैसे बदलूं select?

javascript jquery

— जैक
स्रोत

177

एक सामान्य सीएसएस चयनकर्ता का उपयोग करना:

$('.sys input[type=text], .sys select').each(function() {...})

यदि आपको पुनरावृत्ति पसंद नहीं है:

$('.sys').find('input[type=text],select').each(function() {...})

या अधिक संक्षेप में, contextतर्क में पास करें :

$('input[type=text],select', '.sys').each(function() {...})

नोट: आंतरिक रूप jQueryसे उपरोक्त को find()समतुल्य में बदल देगा

http://api.jquery.com/jQuery/

आंतरिक रूप से, चयनकर्ता संदर्भ .find () विधि के साथ लागू किया जाता है, इसलिए $ ('अवधि', यह) $ (इस) .find ('अवधि') के बराबर है।

मैं व्यक्तिगत रूप से सबसे अधिक पठनीय होने का पहला विकल्प खोजता हूं :), आपका लेना हालांकि

— एंड्रियास वोंग
स्रोत

1

चूंकि, context formइसका उपयोग कर रहा है find form, find formइसलिए context form(एक कॉल फ़ंक्शन टाले जाने वाले) की तुलना में अधिक कुशल है । यह लगभग सभी चयनकर्ता के लिए मान्य है। फिर, IMO की find formतुलना में अधिक कुशल है normal CSS selector, क्योंकि चयनकर्ता के दोनों भाग रूट नोड के सापेक्ष हैं, जहां find form, केवल .sysभाग इसके सापेक्ष है, फिर input[type=text],selectतत्वों के एक बहुत छोटे सेट पर निष्पादित किया जाता है , इसलिए यह तेज हो सकता है (लेकिन इस जरूरत को परीक्षण द्वारा सत्यापित होना चाहिए)

— pomeh

1

@pomeh मैं देख सकता हूं कि आप कहां से आ रहे हैं, लेकिन यदि $कॉल का प्रदर्शन आपके ऐप के लिए महत्वपूर्ण है, तो कृपया jQuery का पूरी तरह से उपयोग करने से बचें :)। इस जवाब ने ओपी के सवाल का जवाब देने की कोशिश की, अगर यह प्रदर्शन का सवाल था, तो यह जवाब पहले स्थान पर नहीं होगा। किसी भी तरह टिप्पणी के लिए धन्यवाद :), इसकी सराहना करते हैं

— एंड्रियास वोंग

1

मेरी टिप्पणी पूर्ण एक $कॉल के बारे में नहीं थी , बल्कि $एक ऐप्पल में मौजूद सभी कॉल के बारे में थी। IMO, जब आपके पास एक ही काम करने के अलग-अलग तरीके होते हैं, तो मैं हमेशा उसी का चयन करने की कोशिश करता हूं जो बेहतर बीसी करता है। slow performance=== unhappy users। इसके अलावा, हम दोनों एक ओपी के प्रश्न का कई उत्तर (जैसा आपने किया) कर सकते हैं और उनमें से प्रत्येक के फायदे / असुविधा प्रदान कर सकते हैं (जैसा कि मैंने टिप्पणी में किया था)। IMO यह नोटिस करना महत्वपूर्ण है कि एक ही परिणाम प्रदान करते समय सभी उत्तर अलग-अलग क्यों हैं। इसके अलावा, हम वेनिला जावास्क्रिप्ट कोड लिख सकते हैं जो धीरे-धीरे प्रदर्शन करता है JavaScript:! ==performance

— pomeh

1

@pomeh प्रदर्शन के बारे में मेरा कहना था, यदि आप वास्तव में प्रदर्शन की परवाह करते हैं, तो jQuery का उपयोग न करें $, अपने divs को विशेष रूप से वर्गीकृत करें और उपयोग करें document.getElemenById/ElementsByClassName, बजाय इसके $कि आपके चयनकर्ता के बहुत सारे चेकिंग / स्ट्रिंग पार्सिंग से, jQuery प्रसिद्ध नहीं है। इसके प्रदर्शनकारी पुस्तकालय के लिए। और मैंने ईमानदारी से एक ऐप को $बहुत अधिक कॉल करने के कारण धीमा नहीं देखा है , अगर आपके पास एक वेबसाइट है जो कि समस्या है, तो कृपया मुझे दिखाओ, मुझे बहुत दिलचस्पी है :)

— एंड्रियास वोंग

2

@pomeh हां, मैं जेएस की आपकी बात से पूरे दिल से सहमत हूं! = प्रदर्शन :), दिन के अंत में, यह अभी भी हमारे लिए उबलता है, प्रोग्रामर वास्तव में समझदार कोड लिखने के लिए। छोटी चर्चा के लिए धन्यवाद, आपका दिन शुभ हो :)

— एंड्रियास वोंग

7

$('.sys').children('input[type=text], select').each(function () { ... });

EDIT: वास्तव में ऊपर दिया गया यह कोड बच्चों के चयनकर्ता के बराबर है .sys > input[type=text]यदि आप वंशज चयन ( .sys input[type=text]) चाहते हैं तो आपको @NiftyDude द्वारा दिए गए विकल्पों का उपयोग करना होगा।

अधिक जानकारी:

— राउटर जे
स्रोत

आपने chilrenइसके बजाय टाइप कियाchildren

— pomeh

5

यदि आपके पास प्रपत्र या तालिका में पाठ के रूप में कई इनपुट हैं, तो आपको इसके माध्यम से पुनरावृति करने की आवश्यकता है, मैंने यह किया:

var $list = $("#tableOrForm :input[type='text']");

$list.each(function(){
    // Go on with your code.
});

मैंने जो किया था, उसे देखने के लिए प्रत्येक इनपुट की जाँच की गई कि क्या प्रकार "पाठ" पर सेट है, तो वह उस तत्व को पकड़ लेगा और उसे jQuery सूची में संग्रहीत करेगा। फिर, यह उस सूची के माध्यम से पुनरावृत्ति करेगा। आप इस तरह से वर्तमान पुनरावृत्ति के लिए एक अस्थायी चर सेट कर सकते हैं:

var $currentItem = $(this);

यह प्रत्येक लूप के लिए आपके वर्तमान करंट को चालू आइटम सेट करेगा। फिर आप अस्थायी चर के साथ जो चाहें कर सकते हैं।

आशा है कि यह किसी को भी मदद करता है!

— जेसन Cidras
स्रोत

3

$('input[type=text],select', '.sys');

लूपिंग के लिए:

$('input[type=text],select', '.sys').each(function() {
   // code
});

— thecodeparadox
स्रोत