Изменение текста в кнопке Jquery

189

30 августа 2018, 13:30

https://codepen.io/st-iv/pen/LBEpzg

После нажатия "вид:таблица" нужно чтобы вместо текста "Товар в корзине" была галочка (для примера это просто буква V). Попытался сделать селекторами, посмотрите что не так

 $('.btn_buy').click(function(e){
   e.preventDefault();
  $(this).html('Товар в корзине').attr('href', '/basket/');
});
 $('.view').click(function(e){
   e.preventDefault();
  $('.goods__item').addClass('view-table');
});
 $('.goods__item .view-table .btn_buy').click(function(e){
   e.preventDefault();
  $(this).html('V').attr('href', '/basket/');
});

Answer 1

У вас тут две проблемы.

Вы пытаетесь повесить обработчик на несуществующий элемент
Лишний пробел в селекторе.

Вот так работает

$('.btn_buy').click(function(e){ 
   e.preventDefault(); 
  $(this).html('Товар в корзине').attr('href', '/basket/'); 
}); 
 
 $('.view').click(function(e){ 
   e.preventDefault(); 
   $('.goods__item').addClass('view-table'); 
   var table_btn = $('.goods__item.view-table .btn_buy'); 
   table_btn.each(function(){ 
    if ($(this).html() == 'Товар в корзине'){ 
      $(this).html('V') 
    } 
   }); 
   table_btn.click(function(e){ 
    e.preventDefault(); 
    $(this).html('V').attr('href', '/basket/'); 
  }); 
});