जब आईडी में डॉट हो तो jquery के साथ ID द्वारा html नोड्स का चयन कैसे करें?

Question

यदि मेरा HTML इस तरह दिखता है:

<td class="controlCell">
    <input class="inputText" id="SearchBag.CompanyName" name="SearchBag.CompanyName" type="text" value="" />
</td>

मैं JQuery के साथ # SearchBag.CompanyName का चयन कैसे कर सकता हूं? मुझे यह काम करने के लिए नहीं मिल रहा है और मुझे डर है कि यह डॉट यह सब तोड़ रहा है। कष्टप्रद बात यह है कि मेरी सभी आईडी का नाम बदलकर बहुत काम किया जाएगा, न कि पठनीयता में कमी का उल्लेख करना।

नोट:
कृपया यह बताना शुरू न करें कि ले-आउटिंग के लिए टेबल कैसे नहीं बनाए जाते हैं। मैं CSS के मूल्य और कमियों से बहुत अवगत हूं और यथासंभव इसका उपयोग करने की कोशिश करता हूं ।

Comments

क्या एक आईडी में एक अवधि भी वैध HTML है?

— cletus

हाँ। आईडी में '-', '_', 'हो सकता है।' तथा ':'। w3.org/TR/html4/types.html#type-name

— बॉब

Jeps, मेरे पेज डबल के अलावा सभी को मान्य करते हैं <शीर्षक> टैग asp.net mvc ढाँचा उत्पन्न करता है ..

— बोरिस कॉल

कैसे मैं एक के साथ तत्वों का चयन करने के लिए jQuery मिलता है

— 2rs2ts

Answer 1

@ टिप्पणी में टिप्पणी:

चूंकि आईडी चयनकर्ताओं को हैश # से पहले होना चाहिए, इसलिए यहां कोई अस्पष्टता नहीं होनी चाहिए

"# Id.class" एक वैध चयनकर्ता है जिसे मिलान करने के लिए एक आईडी और एक अलग वर्ग दोनों की आवश्यकता होती है; यह मान्य है और हमेशा पूरी तरह से निरर्थक नहीं है।

शाब्दिक चयन करने का सही तरीका '।' सीएसएस में इसे से बचना है: "#id \। मोगिद"। यह कुछ पुराने ब्राउज़रों (विशेष रूप से IE5.x) में परेशानी का कारण बनता था, लेकिन सभी आधुनिक डेस्कटॉप ब्राउज़र इसका समर्थन करते हैं।

वही तरीका jQuery 1.3.2 में काम करता है, हालाँकि मैंने इसे पूरी तरह से नहीं देखा है; quickExpr इसे नहीं उठाता है, लेकिन अधिक चयनकर्ता पार्सर इसे सही लगता है:

$('#SearchBag\\.CompanyName');

Comments

"# id.class एक वैध चयनकर्ता है जिसे मिलान के लिए एक आईडी और एक अलग वर्ग दोनों की आवश्यकता होती है": HTML कल्पना के अनुसार, आईडी पूरे दस्तावेज़ में अद्वितीय होनी चाहिए। "# Id.class" के लिए क्या अच्छा होगा? मेरा मतलब है, आप "#id" से अधिक विशिष्ट नहीं हो सकते, क्या आप कर सकते हैं?

— तोमलक

@Tom: "# id.class" एक ही स्टाइलशीट का उपयोग करने वाले कई दस्तावेज़ों के लिए अच्छा हो सकता है, या क्लाइंट-साइड-स्क्रिप्टिंग के साथ राज्यों को सेट कर सकता है। उदाहरण के लिए "# navhome.navselected"।

— बोबिन्स

@ बॉब: हाँ, क्लेटस एक ही उदाहरण के साथ आया था, और मुझे लगता है कि यह मान्य है। फिर भी यह मेरे लिए अजीब लगता है, और मैं ऐसा करने में सक्षम होने का वास्तविक लाभ नहीं देख सकता। विशेष रूप से एचटीएमएल के प्रकाश में आईडी और इस तथ्य में डॉट्स की अनुमति देता है कि आप इसे प्राप्त करने के लिए हमेशा ".navselected" का उपयोग कर सकते हैं।

— तोमलक

उदाहरण के लिए, आप एक चयनित #navabome को एक अलग रंग में चयनित #navabab पर प्रकाश में लाना चाहते हैं, लेकिन अन्य .navselected गुणों को साझा करना चाहते हैं। मैं यह नहीं कहूंगा कि यह स्थिति हर समय आती है, लेकिन मुझे निश्चित रूप से कभी-कभी इसकी आवश्यकता होती है।

— bobince

मुझे लगता है कि @Tomalak का उत्तर अधिक सुरुचिपूर्ण है, जैसे:$('[id="profile.birthdate"]')

— dr.dimitru

Answer 2

एक संस्करण यह होगा:

$("input[id='SearchBag.CompanyName']")

Comments

वास्तव में। क्या आप मुझे बता सकते हैं कि आपका समाधान क्यों काम करता है और $ ("# SearchBag.CompanyName") नहीं करता है?

— बोरिस

क्योंकि .CompanyName को एक वर्ग चयनकर्ता के रूप में माना जाता है।

— cletus

जल्दी से स्रोत कोड को देखते हुए, यह या तो एक जानबूझकर डिजाइन निर्णय या बग है। आईडी चयनकर्ताओं की पहचान करने के लिए उपयोग किए जाने वाले रेगेक्स (क्विक एक्सप्रो नाम) में एक वैध चरित्र के रूप में डॉट शामिल नहीं है। HTML कल्पना हालांकि इसकी अनुमति देती है।

— तोमलक

एक आईडी पर एक वर्ग चयनकर्ता होना संभवतः उपयोगी है। कल्पना करें कि आपके पास प्रत्येक पृष्ठ पर एक #menu तत्व है, लेकिन इसे अपने किसी एक पृष्ठ पर अलग बनाना चाहते हैं। उदाहरण के लिए # menu.hideme? सीमांत मुझे पता है लेकिन यह मान्य है।

— cletus

यह स्पष्ट रूप से बेहतर जवाब है। इस तरह के चर के साथ भी काम करता है: $ ("tr [id = '" + private_var + "']")। css ("पृष्ठभूमि-रंग", "#EEEEEE");

— स्टीव के

Answer 3

यदि आप उपयोग करते हैं तो आपको कुछ भी बचने की आवश्यकता नहीं है document.getElementById:

$(document.getElementById('strange.id[]'))

getElementById मानता है कि इनपुट सिर्फ एक आईडी विशेषता है, इसलिए डॉट को एक वर्ग चयनकर्ता के रूप में व्याख्यायित नहीं किया जाएगा।

Comments

नीट समाधान, गतिशील आईडी के साथ भी अच्छी तरह से काम करता है जिसमें डॉट्स हो सकते हैं

— कुकालिनो

Answer 4

संक्षिप्त उत्तर : यदि आपके पास आईडी = के साथ एक तत्व है "foo.bar", तो आप चयनकर्ता का उपयोग कर सकते हैं$("#foo\\.bar")

लंबा उत्तर : यह jquery प्रलेखन का हिस्सा है - अनुभाग चयनकर्ता जो आप यहाँ पा सकते हैं: http://api.jquery.com/category/selectors/

आपके प्रश्न का उत्तर प्रलेखन की शुरुआत में दिया गया है:

यदि आप किसी भी मेटा-अक्षर (जैसे कि) का उपयोग करना चाहते हैं 
! "# $% & '() * +; /:; @? @ [\] ^` {|} ~) 
एक नाम के शाब्दिक भाग के रूप में, आपको चरित्र से बचना चाहिए 
दो बैकस्लैश: \\। उदाहरण के लिए, यदि आपके पास id = "foo.bar" एक तत्व है:
आप चयनकर्ता $ ("# foo \\। बार") का उपयोग कर सकते हैं। W3C CSS विनिर्देशन शामिल हैं
वैध सीएसएस चयनकर्ताओं के संबंध में नियमों का पूरा सेट। इसके अलावा उपयोगी है
सीएसएस चरित्र पर Mathias Bynens द्वारा ब्लॉग प्रविष्टि पहचानकर्ताओं के लिए अनुक्रम से बचते हैं।

Comments

आपको पता चलता है कि यह प्रश्न तीन साल से अधिक पुराना है और दस्तावेज़ीकरण तब भी ठीक नहीं रहा होगा?

— रिमीस

Answer 5

जब आपकी आईडी किसी वैरिएबल में हो, तो attr चयन उचित लगता है:

var id_you_want='foo.bar';
$('[id="' + id_you_want + '"]');

Answer 6

यह jQuery के चयनकर्ताओं एपीआई में प्रलेखित है :

मेटा-वर्ण (जैसे कि के किसी भी उपयोग करने के लिए !"#$%&'()*+,./:;<=>?@[\]^`{|}~) एक नाम का एक शाब्दिक भाग के रूप में, यह दो बैकस्लैश के साथ के साथ भाग जाना चाहिए: \\। उदाहरण के लिए, एक तत्व id="foo.bar", चयनकर्ता का उपयोग कर सकता है $("#foo\\.bar")।

संक्षेप में, के .साथ उपसर्ग \\।

$('#SearchBag\\.CompanyName')

समस्या यह है कि .एक वर्ग मैच करेगा, इसलिए $('#SearchBag.CompanyName')मैच होगा <div id="SearchBag" class="CompanyName">। आपके द्वारा वांछित आईडी के मिलान के साथ बच गए को बिना किसी विशेष महत्व के \\.सामान्य माना जाएगा .।

यह उन सभी पात्रों पर लागू होता है !"#$%&'()*+,./:;<=>?@[\]^`{|}~जो अन्यथा jQuery में चयनकर्ता के रूप में विशेष महत्व रखते हैं।

Answer 7

जो लोग अधिक सामान्य समाधान की तलाश में हैं, मैंने एक समाधान पाया जो किसी भी विशेष वर्णों से पहले एक पिछड़े स्लैश को सम्मिलित करता है, यह एक div से नाम और आईडी प्राप्त करने से संबंधित मुद्दों को हल करता है जिसमें विशेष वर्ण होते हैं।

"Str1.str2% str3" .replace (/ [^ \ w \ s] / gi, '\\' और ')

"Str1 \\। str2 \\% str3" लौटाता है

आशा है कि यह उपयोगी है!

Answer 8

आप एक विशेषता चयनकर्ता का उपयोग कर सकते हैं:

$("[id='SearchBag.CompanyName']");

या आप तत्व प्रकार निर्दिष्ट कर सकते हैं:

$("input[id='SearchBag.CompanyName']");