php post content in popup div

У меня есть несколько элементов на веб-сайте, которые связаны с отдельными php-сообщениями. На сайте также есть одно всплывающее div («это специальное модальное окно»). Всплывающее окно имеет два раздела, заголовок и контент.php post content in popup div

Когда элементы будут нажаты, появится всплывающее окно. Я хочу, чтобы связанный заголовок и содержимое php-сообщения отображались в всплывающем div в соответствующем разделе.

ПРИМЕЧАНИЕ. Я пробовал в течение недели, чтобы понять это, используя, php, ajax/jquery, комбинации. Я просмотрел google и stackoverflow и не могу найти недостающую ссылку.

Ниже приведена моя структура кода.

FIRST: Это самое близкое, что у меня есть к рабочей модели. Php post_title и post_content добавляются во всплывающее окно в соответствующем месте. Но добавление кода для следующего элемента переопределяет данные первых элементов.

HTML

<div class="hexagon"> 
    <p class="verticalcenter center" data-toggle="popWindow" data-target="#popUp"> 
    <!-- ATTACH LATEST POST TITLE --> 
     <?php $the_query = new WP_Query('cat=4'); ?> 
     <?php while ($the_query -> have_posts()) : $the_query -> the_post(); ?> 
     <?php the_title(); ?> 
     <?php endwhile;?> 
    </p> 
</div> 

<div class="hexagon"> 
    <p class="verticalcenter center" data-toggle="popWindow" data-target="#popUp"> 
    <!-- ATTACH LATEST POST TITLE --> 
     <?php $the_query = new WP_Query('cat=5'); ?> 
     <?php while ($the_query -> have_posts()) : $the_query -> the_post(); ?> 
     <?php the_title(); ?> 
     <?php endwhile;?> 
    </p> 
</div>

Примечание: 'наложение' является фоном с непрозрачностью, которая охватывает основное содержание, чтобы помочь сосредоточиться на 'Popup' дел.

$(document).ready(function() { 
...//other code pertaining to website operation 

//Click on Hexagons && Launch Modal 
    $('.hexagon,.hexagonz,#mapToken,.mobileNav li').on('click', function() { 
    $('.overlay').removeClass('hidden'); 
     $('#popUp') 
     .addClass('animated fadeInUp') 
     .css({ 
      'bottom': '25%' 
     }) 
    }); //end Modal Launch 

...//other code pertaining to website operation 

});// end $(document).ready

Код HTML всплывающее окно (Modal) находится в моем файле footer.php вместе с single.php файла, содержащего дубликат кода всплывающего окна.

ИДЕАЛЬНО: Я хотел бы выполнить это, не прибегая к использованию (a href = ''). На этом сайте есть страница всплеска, которая загружается перед главной страницей при первой загрузке. Когда я попытался исправить это, используя ссылку (a href = ''), она вызывает всплывающую страницу (не то, что я хочу).

Надеемся, что цель и цель целины.

источник

2015-08-13 Zac

Сначала вы должны создать PHP-скрипт для отправки каждой всплывающей подсказки.

Тогда вы можете прикрепить $.post по щелчку, с кнопкой, которая вызывает всплывающее окно открытым, с 'data-contents' или нечто подобное

Тогда сделайте пост, как это:

$(document).on('click', '.myPopupButton', function(e) { 
    e.preventDefault(); 
    data = { content : $(this).attr('data-contents') }; 
    $.post('yourScript.php', data, function(json) { 
     // Handle the data that comes from your script 
     // i.e. : 
     $('.myPopup .title').text(json['title']); 
     $('.myPopup .body').text(json['body']); 
    } 
});

Ваш PHP должен быть ожидая значение как content => xxx

Таким образом, вы можете получить его, как это:

if ($_POST['content'] == 'xxx') { 

} 
else if (/*etc..*/) {}

Теперь содержимое всплывающего окна должно быть изменено динамически

источник

2015-08-13 13:39:52

php post content in popup div

ответ

Смежные вопросы