Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.11.2016, 00:22
Новичок на форуме
Отправить личное сообщение для kossr Посмотреть профиль Найти все сообщения от kossr
 
Регистрация: 28.11.2016
Сообщений: 3

выбор элемента по id из нескольких объектов одного класса
Доброго времени суток.
Есть задача:
много объектов одного класса (магазин), но с уникальными id.
нужно по нажатию на объект отправлять ajax запрос (это работает) и изменять текст в объекте.
function addFav(){
	var $id = $(this);
	console.log('adding to favs id: '+ $id.attr('id'));
	$.ajax({
		type:"post",
		url: "/fav_add.php",
		data: "id="+$id.attr('id'),
		success: function(){
			$('.fav')
                .addClass('active')
                .attr('title','Добавить в избранное')
                .unbind('click')
                .bind('click', removeFav)
		.text('Добавить в избранное');
		}
    });
}

function removeFav(){
	var id = $(this);
	console.log('removing from favs id: '+ id.attr('id'));
	$.ajax({
		type:"post",
		url: "/fav_del.php",
		data: "id="+id.attr('id'),
		success: function(){
            $('.fav')
                 .removeClass('active')
                 .attr('title','Удалить из избранного')
                 .unbind('click')
                 .bind('click', addFav)
		 .text('Удалить из избранного');
		}
    });
}
$('span.fav').on('click', addFav());

понятно, что этот селектор выбирает все объекты класса, но мне нужно менять надпись в конкретно нажатом
Введенные в консоли селекторы $('span#'+9) , и $('.fav[id="9"]') работают, но я не знаю, как его реализовать в коде - код $('.fav[id="'+ $id.attr('id') +'"]') не работает.

итак, вопросы:
1. какой нужен селектор для выбора одного объекта (на который нажали)?
2. даже селектор, выбирающий все, не срабатывает на первое нажатие (ajax передает data: "id='не определен'")
Скажите пожалуйста, в каком направлении копать?
Спасибо.

Последний раз редактировалось kossr, 28.11.2016 в 00:25.
Ответить с цитированием
  #2 (permalink)  
Старый 28.11.2016, 01:09
Профессор
Отправить личное сообщение для Bond Посмотреть профиль Найти все сообщения от Bond
 
Регистрация: 16.06.2013
Сообщений: 172

А $(this) что, не катит? Он как раз и выбирает то на что кликнули.
id не определен потому что передавать объект нужно а не строку как в строке 7 и 25
data: {id: $id.attr('id')},

И здесь финкцию без скобок прописать $('span.fav').on('click', addFav());
Ответить с цитированием
  #3 (permalink)  
Старый 28.11.2016, 12:30
Новичок на форуме
Отправить личное сообщение для kossr Посмотреть профиль Найти все сообщения от kossr
 
Регистрация: 28.11.2016
Сообщений: 3

Поставил {id: $id.attr('id')}, теперь реагирует со второго нажатия (т.е. вместо удаления добавляет, а вместо добавления удаляет), но это ладно, поставлю проверку класса;
А вот если сделать
...success:function(){
            $(this)...

то скрипт вообще перестает работать.
я туда уже чего только не подставлял, и собственно $id вместо $(this), и тупо $this...
Если вставить селектор $('.fav[id="9"]') то при клике на любой меняет именно с id 9, но ведь работает... а как получить эту 9 из $id, я не знаю.
Если попробовать в succsess вставить alert($id.attr('id')) напишет undefined, если alert($id), то object object...
в общем, уперся в это id ...

да, забыл добавить хтмл
Код:
<span id='9' class='fav active' title=''>Добавить в избранное</span>
UPD:
убрал скобки в бинде $('span.fav').on('click', addFav);
добавляет/удалеят нормально, а вот надпись меняет так же криво

Последний раз редактировалось kossr, 28.11.2016 в 12:59.
Ответить с цитированием
  #4 (permalink)  
Старый 28.11.2016, 23:47
Новичок на форуме
Отправить личное сообщение для kossr Посмотреть профиль Найти все сообщения от kossr
 
Регистрация: 28.11.2016
Сообщений: 3

В общем, как-то так
var $sp = $(this).attr('id');
...
$('#'+$sp)
Ответить с цитированием
  #5 (permalink)  
Старый 29.11.2016, 11:11
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

Сообщение от kossr
В общем, как-то так
var $sp = $(this).attr('id');
...
$('#'+$sp)
Масло масленное... Можно просто this запомнить до ajax и пользоваться им, хоть и в success
var that = this;

...success:function(){
            $(that)...

Последний раз редактировалось Dilettante_Pro, 29.11.2016 в 11:19.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Изменение класса элемента в зависимости от разрешения экрана funfot Элементы интерфейса 3 20.09.2014 15:20
выбор первого блока определенного класса imediasun1 Элементы интерфейса 3 15.08.2013 16:58
теги в выделенном фрагменте woojin Events/DOM/Window 48 15.08.2012 19:13
Выбор одного элемента по клику boilroom Events/DOM/Window 2 09.06.2011 21:15
Как изменить свойство css у всех элементов одного класса AlexJ Events/DOM/Window 7 19.03.2011 06:25