затухание jquery в специфике c div - PullRequest
Новая
       4

затухание jquery в специфике c div

0 голосов
/ 24 января 2020

Я хочу fadeOut специфицированный c div, который был выбран с использованием класса.

Так что мой HTML выглядит так 

<div class="container" id="conversations">
 <button class="delete" id="1"></button>
</div>

<div class="container" id="conversations">
 <button class="delete" id="2"></button>
</div>

<div class="container" id="conversations">
 <button class="delete" id="3"></button>
</div>

Так вот, если я выбрал кнопка удаления с идентификатором, равным 3, как я буду затухать текущий элемент div?

Это мой jQuery на данный момент (не работает) 

$(document).on('click', '.delete', function(e){
        e.preventDefault();
          $(this).fadeOut();
    });

Это функции, которые я пробовал 

$('div.container').fadeOut(1000); // working but remove all divs
                $(this).fadeOut(); // not working
                jQuery(this).parent('div.container').fadeOut(1000); // not working
                $(this).parent("div.container").fadeOut(); // not working
                $(this).parent($('div.container')).fadeOut(); // not working

Обновление:

Решает эту проблему путем повторной инициализации его элемента 

var _this = $(this);

Я вызываю $ (this) .fadeOut ( ) в успешном обратном вызове ajax, где, вызывая $ (this), вы указываете на функцию успеха.

Таким образом, делая это в потоке обратного вызова успеха c, он теперь работает: 

_this.parent('div.container').fadeOut();

Ответы [ 3 ]

0 голосов
/ 24 января 2020

Ваш код работает нормально 

$(document).on('click', '.delete', function(e){
   e.preventDefault();
   $(this).fadeOut();
});
<div class="container" id="conversations">
 <button class="delete" id="1">Button 1</button>
</div>

<div class="container" id="conversations">
 <button class="delete" id="2"> Button 2</button>
</div>

<div class="container" id="conversations">
 <button class="delete" id="3">Button 3</button>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
0 голосов
/ 24 января 2020

Это чистый javascript скрытый родительский элемент при нажатии, попробуйте это. 

  var g = document.getElementsByClassName('delete');
  for (var i = 0, len = g.length; i < len; i++)
  {

        (function(index){
            g[i].onclick = function(){
                  g[index].parentElement.style.display = "none";
            }    
        })(i);

  }
0 голосов
/ 24 января 2020

Приведенный выше код должен работать, у меня работает. Добавьте некоторое содержимое к кнопке, чтобы увидеть разницу. 

[https://jsfiddle.net/uxmfnsb7/1/][1]
...