Как настроить таргетинг на класс, который нажимается внутри элемента div с именем в ajax - PullRequest
Новая
       5

Как настроить таргетинг на класс, который нажимается внутри элемента div с именем в ajax

0 голосов
/ 08 марта 2020

Во-первых, не могли бы вы объяснить, как браузер хранит содержимое div, вызываемое в ajax.

Я не понимаю, почему содержимое, вызываемое в ajax и отображаемое в инспекторе браузера, может ' t * быть напрямую нацеленным на jquery.

Тогда, как я могу легко нацелиться на класс (close-window-post) внутри div, вызываемого в ajax, чтобы закрыть этот. В моих похожих вопросах ответ расскажет о другом ajax вызове, указывающем целевой класс c внутри div, вызываемый в ajax.

Единственное, что работает, - это нацеленность на заземленный div ( window-post) div вызывается в ajax: 

<div id='window-post' class='win-post dis-none pos-abs p-1v w-100vw h-100vh zIndex899'>
//Call in ajax  <div class="w-100 h-100 d-flex-center"><i class="im-x-mark"></i></div> 
</div>

Мой скрипт 

jQuery('#window-post').find('.im-x-mark').on('click',function(){
    jQuery('#window-post').addClass('dis-none');   
    // Or jQuery('#window-post').hide();
});

Мой скрипт вызывается в следующем порядке:

Admin- ajax. php

вызов ajax. php

мой Jquery. js файл

Я хорошо добавлю "jQuery (документ ) .ready (function () {"в моем Jquery. js.

(редактировать) Вот мой ajax вызов с вашим: 

jQuery(document).ready(function(){

function CloseAjaxPost(){
  jQuery('#window-post .post-title').find('.im-x-mark').on('click',function(){
        alert('Whaouuuuuh !!!');
        jQuery('#window-post').addClass('dis-none');   
    });
 }

jQuery('.post-link').click(function() {
  var post_id = jQuery(this).data("id");
  jQuery.ajax({
      type: "POST",
      url: ajaxurl,
      data: {'action': 'more_content','the_ID': post_id},
      dataType: 'json',
      success: function (data) {jQuery('#window-post').html(data);}
  });
});
});

Ответы [ 2 ]

0 голосов
/ 09 марта 2020

Ваш код привязывает обработчик кликов ко всем .im-x-mark элементам, которые существуют при загрузке страницы. Однако содержимое вашего вызова ajax еще не существует после загрузки страницы. Поэтому обработчик кликов не связан с этими элементами.

Лучшим вариантом будет использование делегирования события. Предполагая, что #window-post является ближайшим родительским элементом stati c, вы можете выполнить делегирование события оттуда. JQuery имеет большую поддержку для этого, используя функцию on с необязательным параметром селектора.

См. https://api.jquery.com/on/

Код будет выглядеть следующим образом. 

jQuery('#window-post').on('click', '.im-x-mark', function(){
    jQuery('#window-post').addClass('dis-none');   
    // Or jQuery('#window-post').hide();
});
0 голосов
/ 08 марта 2020

Вам нужно вызвать функцию после загрузки ajax. Как то так: 

function callAfterAjaxPost() {
    jQuery('#window-post').find('.im-x-mark').on('click',function(){
        jQuery('#window-post').addClass('dis-none');   
        // Or jQuery('#window-post').hide();
    });
}

$.ajax({
  url: "callajax.php",
  context: document.body
}).done(function() {
  callAfterAjaxPost(); // Call function
});
...