Question

我在网站中有几个链接到单独的php帖子的元素。该网站还有一个弹出式div（＆＃39;它是一个自定义模式窗口＆＃39;）。弹出div有两个部分，标题和内容。

单击元素后，将出现弹出窗口。我希望关联的php帖子标题和内容出现在其正确部分的弹出div中。

注意：我已经尝试了一周使用，php，ajax / jquery，组合。我已经搜索了谷歌和stackoverflow，似乎找不到丢失的链接。

以下是我的代码结构。

第一：这是我最接近工作模式的人。 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>

JS

注意：＆＃39;叠加＆＃39;是一个不透明的背景，涵盖主要内容，以帮助专注于＆＃39; popUp＆＃39;格。

$(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

弹出窗口（Modal）html代码位于我的footer.php文件中，同时还包含一个包含重复弹出窗口代码的single.php文件。

理想：我想在不使用（a href =＆＃39;＆＃39;）的情况下实现这一目标。该网站有一个启动页面，在首次加载时加载到主页面前。当我尝试使用（a href =＆＃39;＆＃39;）链接修复此问题时，会触发启动页面（不是我想要的）。

希望结构和目标明确。

Answer 1

您应首先创建一个PHP脚本，以便为每个弹出窗口发送正确的信息。

然后你可以点击screen sudo somecommand点击一个触发弹出窗口的按钮，用$.post或类似的东西

然后像这样做：

'data-contents'

您的PHP应该期望像$(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']); } });

这样的值

所以你可以这样得到它：

content => xxx

现在弹出窗口的内容应该改变

php在popup div中发布内容

1 个答案: