根据点击链接的href值查询不同的Wordpress页面

Question

I have a list of links on a page, each linking to an id of a div on the page. The idea is that on click, a modal launches with the inline content.

The HTML is as follows:

<a href="#cardiacModal">Cardiac Care</a>
<a href="#emergencyModal">Emergency</a>
.... and many more

and the modals:

<div style="display:none">
    <div id="cardiacModal">
        <?php query_posts( array('p' => 57, 'post_type' => 'directions') );
        if (have_posts()) : while (have_posts()) : the_post(); ?>
              <p><?php the_title(); ?></p>
        <?php endwhile; endif; ?>
    </div>

    <div id="emergencyModal">
        <?php query_posts( array('p' => 54, 'post_type' => 'directions') );
        if (have_posts()) : while (have_posts()) : the_post(); ?>
              <p><?php the_title(); ?></p>
        <?php endwhile; endif; ?>
    </div>
    ... and many more
</div>

In total, there are about 50 different links triggering 50 seperate modals. Within each modal I am using php to pull content from a specific Wordpress page. Now, this page is starting to get a bit heavy weight with over 800 lines of code!

I am looking for a different approach - to have one single modal with conditional statements saying, if the user clicked on link x , then we want to query page id x within wordpress.

Im really not sure the best way to go about this, or if it is even possible. I am basically looking for an alternate solution to avoid having 50 modals - I would rather have one modal with logic that controls which wordpress page content is being pulled from.

CURRENTLY, I think the best solution would be to place each modal in a separate php file and using jquery to load that ajax...but I would prefer an alternate solution. Thoughts?

Answer 1

You can receive everything in the same page, like " http://domain.com/clinic?c=cardiacModal " so, in your page you put a switch statement like:

<?php
switch($_GET['c']){
   case 'cardiacModal' : $p = 57; break;
   case 'emergencyModal' : $p = 54; break;
   "..."
   default;
}
if(!empty($_GET['c']): ?>
 <div id="cardiacModal">
  <?php query_posts( array('p' => $p, 'post_type' => 'directions') );
    if (have_posts()) : 
        while (have_posts()) : the_post(); ?>
          the_title();
        <?php endwhile; 
    endif; ?>
  </div>
<?php endif; ?>

Answer 2

我将为模式框内容页面（基本上只是内容容器，只需要最少的CSS）创建一个超级准系统页面模板，然后将其作为iframe或AJAX传递到模式框中。