this jQuery selector works $("[id^='updates-pane']") but this doesn't $("#updates-pane-user.followed_on") I don't see what is wrong.. "> this jQuery selector works $("[id^='updates-pane']") but this doesn't $("#updates-pane-user.followed_on") I don't see what is wrong.. "> this jQuery selector works $("[id^='updates-pane']") but this doesn't $("#updates-pane-user.followed_on") I don't see what is wrong.. " />

Почему этот селектор jquery не работает с периодом работы

У меня есть div с идентификатором

<div id="updates-pane-user.followed_on">

this jQuery selector works

$("[id^='updates-pane']")

but this doesn't

$("#updates-pane-user.followed_on")

I don't see what is wrong.. id names can include periods right? Am I missing something obvious?

18
это кажется очень несовместимым дизайном. возможно, не очень, но раздражает
добавлено автор Nick Ginanto, источник
Просто попробовал сам. Да, это не работает. Хотя все ваши персонажи должны быть действительными.
добавлено автор Richard Neil Ilagan, источник
Используется метод двойной обратной косой черты из ссылки @ jlg1987. $ ('# updates-pane.user \\. follow_on') успешно выбирает div .
добавлено автор Richard Neil Ilagan, источник
Хотя это может быть разрешено, лучше не добавлять эти символы в атрибут ID - просто потому, что это не хорошая практика с jQuery :) Хороший вопрос, хотя, +1!
добавлено автор Jimbo, источник
@NickGinanto На самом деле, он точно соответствует поведению селекторов CSS. Как еще вы могли бы выбрать элемент с идентификатором и классом?
добавлено автор JJJ, источник
что должно работать, что-то еще должно быть неправильным. stackoverflow.com/questions/70579/…
добавлено автор hvgotcodes, источник
вы пробовали без периода?
добавлено автор DKSan, источник
Я нашел это, что может быть полезно: jQuery для выбора элементов с периодом в их id "> stackoverflow.com/questions/350292/…
добавлено автор Jason, источник

9 ответы

В последнем селекторе . используется для обозначения класса. Поэтому он ищет класс .followed_on , который он явно не находит и поэтому ничего не сопоставляется.

Чтобы исправить это, я думаю, вам следует избегать точки с помощью double-backslash :

<Код> $ ( "# обновления-панели пользователь \\. Followed_on")

В соответствии с документами jQuery :

To use any of the meta-characters ( such as !"#$%&'()*+,./:;<=>[email protected][]^`{|}~ ) as a literal part of a name, it must be escaped with with two backslashes: \\. For example, an element with id="foo.bar", can use the selector $("#foo\\.bar").

В общем случае попробуйте не использовать периоды или другие специальные символы в своих идентификаторах, чтобы избежать путаницы вокруг. «Разрешено» - это не то же самое, что «хорошая практика».

31
добавлено
но согласно stackoverflow.com/questions/70579/… он может включать периоды
добавлено автор Nick Ginanto, источник
@Blazemonger: И не только jQuery, но и CSS.
добавлено автор BoltClock, источник
Да, они просто не говорят, что говорят jQuery, - попробуйте two обратную косую черту :)
добавлено автор Jimbo, источник
Спасибо за исправление этого @Blazemonger - очевидно, что SO пасты не всегда хорошо работают;) Я также добавлю ваше мнение.
добавлено автор Jimbo, источник
@NickGinanto Идентификатор может иметь период, да. Но jQuery предполагает, что это означает класс, когда он помещается внутри селектора, поэтому вам нужно избегать его. В общем, попробуйте НЕ использовать периоды или другие специальные символы в своих идентификаторах, чтобы избежать путаницы вокруг. «Разрешено» - это не то же самое, что «хорошая практика».
добавлено автор Blazemonger, источник

Да, HTML5 допускает период в id, но jQuery не создается w3 org. Это просто библиотека утилиты, оптимизированная для наиболее распространенных случаев.

Если ваш идентификатор имеет период или любой другой символ, который делает jQuery синтаксическим анализом, это больше, чем просто идентификатор, тогда вам лучше использовать стандартную функцию:

$(document.getElementById(yourId))

Это предпочтительное решение, если ваш идентификатор поступает из переменной.

4
добавлено

$("#updates-pane-user\\.followed_on") - This Should work as per the Jquery documentation

// Does not work
 $("#some:id")

//Works!
 $("#some\\:id")

//Does not work
 $("#some.id")

//Works!
 $("#some\\.id")
4
добавлено

Из-за точки в атрибуте id , который в синтаксисе jQuery представляет селектор классов. Этот селектор эквивалентен выбору узла как:

<div id="updates-pane-user" class="followed_on">

3
добавлено

Поскольку селектор . считает, что существует класс со следующим именем

$("#updates-pane-user.followed_on")

means : find all elements with id = updates-pane-user which have class name followed_on

2
добавлено

Используйте это, чтобы избежать вашей точки:

$("#updates-pane-user\\.followed_on")

Reference: http://docs.jquery.com/Frequently_Asked_Questions#How_do_I_select_an_element_by_an_ID_that_has_characters_used_in_CSS_notation.3F

2
добавлено

В течение определенного времени создается проблема для jQuery для распознавания шаблона.

jQuery имеет три типа селекторов:

  1. "." selector means to select an element by class name.
  2. "#" selector means to select an element by ID.
  3. And Element selector that selects elements by their name(div, input etc.)

И вы смутили jQuery engine своим соглашением об именах ID.

Предполагая, что существует div с id = "updates-pane-user" и прикладной class = "follow_on" . В таких случаях jQuery предлагает избежать последовательности, используя //. Ниже должен быть ваш syntex для выбора элемента.

$("#updates-pane-user\\.followed_on");

Check it out this wrong fiddle and try to correct using // : http://jsfiddle.net/ukJ8Z/

Ура !!

2
добавлено

yes Jimbo answer is correct, but you can still make that work with escaping character with \\

$("#updates-pane-user\\.followed_on")

Побег с двойной (2) обратной косой чертой.

Check this link for How do I select an element by an ID that has characters used in CSS notation?

1
добавлено
Двойная обратная косая черта была частью моего первоначального ответа , поэтому не уверен, почему вы ставите «... , но вы все равно можете сделать эту работу с экранирующим символом с помощью \\";)
добавлено автор Jimbo, источник
@Jimbo, да, я думаю, вы обновили свой ответ после добавления обратной косой черты, потому что я нахожу ее изначально. , поэтому не уверен, почему вы положили «. Что вы имели в виду?
добавлено автор DON, источник

Вы также можете использовать селектор атрибутов id, например:

$('[id="updates-pane-user.followed_on"]')

потому что jQuery будет рассматривать атрибут как строку, а не селектор класса jQuery.

0
добавлено
Верстка сайтов HTML/CSS/JS/PHP
Верстка сайтов HTML/CSS/JS/PHP
3 439 участник(ов)

Правила группы: напишите !rules в чате. Группа Вк: vk.com/web_structure Freelancer: @web_fl Веб Дизайн: @dev_design Маркетолог: @topmarkening Автор: @M_Boroda