Intereting Posts
не может остановить cron и / или что-то еще вызывает отключенную wp-cron.php мои сообщения сохраняются как черновики Отображать имя пользователя в качестве родительского пункта меню Как извлекать значения из базы данных WP на основе выбранного значения параметра путем onchange с помощью PHP? Как восстановить удаленный сайт в WordPress Multisite? Ошибка регистрации пользователя в WordPress SEO не работает на страницах WordPress меняет мои ссылки, сохраняя его в таблице. Избегайте WordPress, классифицируя запрос постоянной ссылки как не найденный 404 Page WordPress запрашивает внутреннее соединение внутри одной таблицы 5 раз? Получить несколько префикса db с помощью $ wpdb Ограничить скрипты и стили на панели управления ролью пользователя Какой плагин вы используете для превращения сайта на WordPress в агрегатор блога вернуть сохраненные значения метабокса в поля, а затем отобразить на лицевой стороне Хотя перезаписывать двигатель включен, я получаю 404 не найденных на каждой странице

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

Я разработал страницу шаблона, в которой отображается сетка «сотрудников» (настраиваемый тип сообщения). Эта часть отлично работает, но мне также нужно настроить лайтбокс, чтобы отображать дополнительные сведения по щелчку. Чтобы не загружать все в одно и то же время, я создал сценарий ajax. Этот сценарий использует wp-load.php для захвата почтовых данных на основе его идентификатора.

Шаблон выглядит следующим образом:

<!-- Hide the lightbox by default --> <style> .lightbox {display:none;} .noscroll {overflow:hidden;} </style> <!-- This script triggers the lightbox and ajax event --> <script> $(window).bind("load resize scroll", function() { $('.employees').each(function(){ $(this).stop().click(function() { var eid = ""; var eid = $(this).data('id'); $('body').stop().addClass('noscroll'); $('.lightbox').stop().fadeIn(250); console.log('eid'); $.ajax({ url: '/wp-content/themes/dev/load-employee.php?id='+eid, type:'POST', dataType: 'html', success: function(data){ $('.lightbox .html(data).promise().done(function(){ $('.lightbox').fadeIn(250); }); } }) $('.lightbox').click(function(){ $('body').stop().removeClass('noscroll'); $('.lightbox .card').stop().fadeOut(250); $(this).stop().fadeOut(250).scrollTop(0); }); }); }); }); </script> <div class="lightbox"> <!-- Use javascript to append load-employee.php data here --> </div> <? $employees = new WP_Query( array( 'post_type' => 'employees', 'posts_per_page' => -1, 'order' => 'ASC' ) ); while ( $employees->have_posts() ) : $employees->the_post();?> <a class="employee" data-id="<?echo get_the_ID();?>"> <!-- Echo employee information --> </a> <? endwhile; wp_reset_postdata(); ?> 

Это самая важная часть:

 url: '/wp-content/themes/dev/load-employee.php?id='+eid, 

Когда запускается скрипт $ .ajax, он подталкивает «идентификатор данных» к этому документу через URL-адрес. (Если есть лучший способ сделать это, пожалуйста, дайте мне знать)

load-employee.php выглядит так:

 <? // Need this file to make it work include_once('../../../wp-load.php'); // Get post ID from url if (isset($_GET['id'])) { $id = $_GET["id"]; }else{ exit; } //Use ID to generate single post to echo back to template page. $args = array('posts_per_page' => 1, 'p' => $id, 'post_type' => 'employees'); $employeepost = get_posts( $args ); foreach ( $employeepost as $post ) : setup_postdata( $post ); ?> <!-- Single post that matches $id is dumped here --> <? endforeach; ?> 

Это тоже работает, хотя и медленно. После того, как он генерирует одно сообщение, данные вставляются в div.

 success: function(data){ $('.lightbox .html(data).promise().done(function(){ $('.lightbox').fadeIn(250); }); } 

Поэтому проблема, с которой я сталкиваюсь, заключается в том, что весь этот процесс идет медленно. Достаточно медленно, чтобы быстро щелкнуть. Наиболее распространенная проблема заключается в том, что один и тот же пост будет загружаться в лайтбокс несколько раз подряд. Я предполагаю, что это связано с тем, что файл employee-loader.php занимает слишком много времени для обработки нового запроса, когда сценарий ajax вызывает его.

Есть лучший способ сделать это? Возможно, что-то, что не требует wp-load.php?

Если нет, кто-нибудь знает, как я могу оптимизировать то, что у меня есть сейчас?

Благодарю.

Вы ajax-логика выглядят нормально .. Чтобы решить проблему дублирования, вам нужно добавить флаг.

Пример:

 var isLoading = false; -- Your click event is here -- // Only let things to happen if there's no ajax in the middle of process if( isLoading == false ) { // Set it to true - now nothing happens if you click it again isLoading = true; -- All your ajax logic here -- // Complete triggers in both cases: "success" or "error" complete: function() { // Ajax is now done, let's let user to trigger another one if he/she wants isLoading = false; } } 

К сожалению, ajax в WordPress – это не самая быстрая вещь на Земле. У WordPress много junk in the trunk и ему нужно загрузить большое количество скриптов, даже с помощью вызовов ajax.

Попробуйте выполнить поиск в Интернете, может быть несколько трюков и советов, чтобы ускорить WordPress ajax ..