Question

我已经接管了一个WordPress网站，当点击另一个div中的链接时，该网站使用jquery显示/隐藏框架中的内容。这适用于除IE7之外的所有浏览器。在IE7中，没有任何反应。什么都没有。并且它不会引发任何错误。这是我正在使用的代码

HTML：

<div id="campaignCards" class="contentBody">
<?php $args = array( 
   'post_type' => 'home_promos', 
   'posts_per_page' => 8,
   'order' =>'ASC' );
     $postcount = 0;
    $loop = new WP_Query( $args );
    while ( $loop->have_posts() ) : $loop->the_post(); ?>
     <a class="slideLink" href="<?php if(get_post_meta($post->ID,     
         'mcb2b_home_promos_link', true)) { echo get_post_meta($post->ID,   
         'mcb2b_home_promos_link', true); } ?>">
     <div class="campaign_card" id="card<?php echo $postcount; ?>">
       <?php the_content();?>
     </div>
     </a>
      <? $postcount++; endwhile; ?> 
</div>          
<div id="homebuttons">
<ul>
    <?php $args = array( 
    'post_type' => 'home_promos', 
    'posts_per_page' => 8,
    'order' =>'ASC' );
      $postcount = 0;
       $loop = new WP_Query( $args );
       while ( $loop->have_posts() ) : $loop->the_post(); ?>
    <li class="campaignPicker">
       <a href="javascript:showonlyone('card<?php echo $postcount; ?>');">
            <?php if (has_post_thumbnail()) {the_post_thumbnail();} ?>
       </a>
    </li>
      <?php  $postcount++; endwhile; ?>
</ul>
</div>

JS

function showonlyone(thechosenone) {
      var campaign_card = document.getElementsByTagName("div");
            for(var x=0; x<campaign_card.length; x++) {
                  name = campaign_card[x].getAttribute("class");
                  if (name == 'campaign_card') {
                        if (campaign_card[x].id == thechosenone) {
                        campaign_card[x].style.display = 'block';
                  }
                  else {
                        campaign_card[x].style.display = 'none';
                  }
            }
      }
}

我认为问题出在var campaign_card = document.getElementsByTagName("div");，但我不熟悉在IE中调试的jquery。任何帮助将不胜感激。

谢谢

Answer 1

好吧，你的代码似乎根本不使用jQuery。如果你想使用jquery的强大功能，我建议你阅读教程here。

无论如何，对于你的问题，你想尝试这个：

function showonlyone(thechosenone) {
  $(".campaign_card").hide();
  $("#" + thechosenone).show();
}

Answer 2

function showonlyone(thechosenone) {
  $('div#' + thechoenone).css('display', 'block');
  $('div.campaign_card').css('display', 'none');
}

试试这个而不是你的功能。注意，您需要确保将jQuery库作为项目的一部分包含在内。

隐藏/显示div在IE7中不起作用

2 个答案: