Javascript-форум (https://javascript.ru/forum/)
-   (X)HTML/CSS (https://javascript.ru/forum/xhtml-html-css/)
-   -   Проблемка с изменением css стиля jQuery (https://javascript.ru/forum/xhtml-html-css/49396-problemka-s-izmeneniem-css-stilya-jquery.html)

Georrg 11.08.2014 16:39

Проблемка с изменением css стиля jQuery
 
Задача следующая:
Нужно изменять цвет текста у определенных задач в модуле ганта. Для этого я написал селектор, но почему-то он работает не совсем верно:
function getValueRMT(item){

		jQuery('[task_id='+item.id+']').addClass('redcolor');
};

где нужная строка(на которую нацелен селектор), выглядит следующим образом:

Класс redcolor: .redcolor{color: red;}
НО! Вместе выделения данного контеста выделяется подобный ему(их всего 3 нужно выделить именно этот ), пример:
<div task_id="22" class="gantt_task_line redcolor" style="left: 25793.006944444445px; top: 282px; height: 30px; line-height: 30px; width: 1942px;">

WorM32 11.08.2014 16:57

Селектор неправильный. У вас класс ставится родителю выделенного элемента.

Georrg 11.08.2014 17:12

Нет, проблема не в этом(конечно селектор сейчас не на тот элемент)Но класс должен был добавиться хотябы к родительскому элементу, а его там нет

WorM32 11.08.2014 17:16

http://learn.javascript.ru/css-selectors#отношения
http://api.jquery.com/child-selector/

Georrg 11.08.2014 17:27

спасибо конечно, полезная информация, только на главный вопрос не отвечает. Почему селектор выбирает только 1 из 3 таких полей(у всех трех одинаковый айдишники, только классами отличаются.) Выборку я делаю по таск айди, но по НЕПОНЯТНЫМ мне причинам, класс добавляется только к 1. 2 других вроде как выделились(если в консоль вывести кол-во элементов удовлетворяющих запросу, то их 3) Но класс recolor добавляется только к 1 из 3. Вот это основная моя проблема.

рони 11.08.2014 17:40

Georrg,
Вопрос пора в FAQ заносить (если его там нет).

Georrg 11.08.2014 17:47

рони,
Немного покопавшись в коде, я кое что нашел.
1) Т.К. эта функция вызывается много раз, то селектор сработал даважды:
а)
[div.gantt_task_line, prevObject: n.fn.init[1], context: document, selector: "[task_id=22]", jquery: "1.11.0", constructor: function…]
0: div.gantt_task_line.redcolor
context: document
length: 1
prevObject: n.fn.init[1]
selector: "[task_id=22]"

б)
0: div.gantt_row.redcolor
1: div.gantt_task_row.redcolor
2: div.gantt_task_line.redcolor
context: document
length: 3
prevObject: n.fn.init[1]
selector: "[task_id=22]"
__proto__: Object[0]

Вот, а класс redcolor Добавляется исходя из первого селектора. Второй почему то его не перекрывает. Наверное это уже не проблема css. Теперь совсем не понятно куда двигаться(

devote 11.08.2014 17:48

Цитата:

Сообщение от Georrg
Почему селектор выбирает только 1 из 3 таких полей

потому что jQuery не умеет выбирать по ID тегам несколько элементов, так как использует стандартный getElementById который возвращает лишь первый найденный, если вам нужно все же найти несколько элементов, используйте встроенный в браузер движок выборки по селекторам. Примерно так:
jQuery(document.querySelectorAll('[task_id='+item.id+']')).addClass('redcolor');

рони 11.08.2014 17:48

Georrg,
вы кавычки то поставили в селектор?

Georrg 11.08.2014 17:51

Цитата:

Сообщение от devote (Сообщение 325376)
потому что jQuery не умеет выбирать по ID тегам несколько элементов, так как использует стандартный getElementById который возвращает лишь первый найденный, если вам нужно все же найти несколько элементов, используйте встроенный в браузер движок выборки по селекторам. Примерно так:
jQuery(document.querySelectorAll('[task_id='+item.id+']')).addClass('redcolor');

большое спасибо! Консоль правда всеравно ругается(Uncaught SyntaxError: Failed to execute 'querySelectorAll' on 'Document': '[task_id=22]' is not a valid selector. ) Но зато я знаю куда двигаться!!


Часовой пояс GMT +3, время: 04:16.