2012-02-15 46 views
-1

我建立一个WordPress站点,二十11的主题。我想要一个小部件区域只显示在某个页面上。的getElementById没有得到ID在WordPress 3.3.1

所以加入JavaScript函数到<head>其通过<body onload="show_collection_area">

该函数调用叫,由于执行console.log(obj.id)写道:“文本-2”到控制台(这是正确的ID )。但是当我在这个功能中设置visibilty为none:

function show_collection_area(){ 
    if (document.location == "http://dutchmountaineer.com/wp/?page_id=116"){ 
     obj = document.getElementById('text-2'); 
     obj.style.visibility = 'visible'; 
     console.log(obj.id) 
     console.log(obj); 
    } else { 
     document.getElementById("text-2").style.visibility = 'none'; 
    } 
} 

没有发生。我尝试使用按钮从页面本身调用函数,但结果相同。

我在做什么错了?

非常感谢!

PS整个代码:

<?php 
/** 
* The Header for our theme. 
* 
* Displays all of the <head> section and everything up till <div id="main"> 
* 
* @package WordPress 
* @subpackage Twenty_Eleven 
* @since Twenty Eleven 1.0 
*/ 
?><!DOCTYPE html> 
<!--[if IE 6]> 
<html id="ie6" <?php language_attributes(); ?>> 
<![endif]--> 
<!--[if IE 7]> 
<html id="ie7" <?php language_attributes(); ?>> 
<![endif]--> 
<!--[if IE 8]> 
<html id="ie8" <?php language_attributes(); ?>> 
<![endif]--> 
<!--[if !(IE 6) | !(IE 7) | !(IE 8) ]><!--> 
<html <?php language_attributes(); ?>> 
<!--<![endif]--> 
<head> 
</head> 

<meta charset="<?php bloginfo('charset'); ?>" /> 
<meta name="viewport" content="width=device-width" /> 
<title><?php 
    /* 
    * Print the <title> tag based on what is being viewed. 
    */ 
    global $page, $paged; 

    wp_title('|', true, 'right'); 

    // Add the blog name. 
    bloginfo('name'); 

    // Add the blog description for the home/front page. 
    $site_description = get_bloginfo('description', 'display'); 
    if ($site_description && (is_home() || is_front_page())) 
     echo " | $site_description"; 

    // Add a page number if necessary: 
    if ($paged >= 2 || $page >= 2) 
     echo ' | ' . sprintf(__('Page %s', 'twentyeleven'), max($paged, $page)); 

    ?></title> 
<link rel="profile" href="http://gmpg.org/xfn/11" /> 
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo('stylesheet_url'); ?>" /> 
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" /> 
<!--[if lt IE 9]> 
<script src="<?php echo get_template_directory_uri(); ?>/js/html5.js" type="text/javascript"></script> 
<![endif]--> 
<?php 
    /* We add some JavaScript to pages with the comment form 
    * to support sites with threaded comments (when in use). 
    */ 
    if (is_singular() && get_option('thread_comments')) 
     wp_enqueue_script('comment-reply'); 


    /* Always have wp_head() just before the closing </head> 
    * tag of your theme, or you will break many plugins, which 
    * generally use this hook to add elements to <head> such 
    * as styles, scripts, and meta tags. 
    */ 
    wp_head(); 
?> 
<script type="text/javascript"> 
$(document).ready(function(){ 
    $("button").click(function(){ 
    $("button").hide(); 
    }); 
}); 

function show_collection_area(){ 
    if (document.location == "http://dutchmountaineer.com/wp/?page_id=116"){ 
     obj = document.getElementById('text-2'); 
     obj.style.visibility = 'visible'; 
     console.log(obj.id) 
     console.log(obj); 
    } else { 
     document.getElementById("text-2").style.visibility = 'none'; 
    } 
} 

function display_gallery(id) 
{ 
    //first we set all displays to none 
    document.getElementById(id).style.display = 'none'; 
} 
</script> 
</head> 

<body onload = "show_collection_area()" <?php body_class(); ?>> 
<div id="page" class="hfeed"> 
    <header id="branding" role="banner"> 
      <hgroup> 
       <h1 id="site-title"><span><a href="<?php echo esc_url(home_url('/')); ?>" title="<?php echo esc_attr(get_bloginfo('name', 'display')); ?>" rel="home"><?php bloginfo('name'); ?></a></span></h1> 
       <h2 id="site-description"><?php bloginfo('description'); ?></h2> 
      </hgroup> 

      <?php 
       // Check to see if the header image has been removed 
       $header_image = get_header_image(); 
       if (! empty($header_image)) : 
      ?> 
      <a href="<?php echo esc_url(home_url('/')); ?>"> 
       <?php 
        // The header image 
        // Check if this is a post or page, if it has a thumbnail, and if it's a big one 
        if (is_singular() && 
          has_post_thumbnail($post->ID) && 
          (/* $src, $width, $height */ $image = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), array(HEADER_IMAGE_WIDTH, HEADER_IMAGE_WIDTH))) && 
          $image[1] >= HEADER_IMAGE_WIDTH) : 
         // Houston, we have a new header image! 
         echo get_the_post_thumbnail($post->ID, 'post-thumbnail'); 
        else : ?> 
        <img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" /> 
       <?php endif; // end check for featured image or standard header ?> 
      </a> 
      <?php endif; // end check for removed header image ?> 

      <?php 
       // Has the text been hidden? 
       if ('blank' == get_header_textcolor()) : 
      ?> 
       <div class="only-search<?php if (! empty($header_image)) : ?> with-image<?php endif; ?>"> 
       <?php get_search_form(); ?> 
       </div> 
      <?php 
       else : 
      ?> 
       <?php get_search_form(); ?> 
      <?php endif; ?> 

      <nav id="access" role="navigation"> 
       <h3 class="assistive-text"><?php _e('Main menu', 'twentyeleven'); ?></h3> 
       <?php /* Allow screen readers/text browsers to skip the navigation menu and get right to the good stuff. */ ?> 
       <div class="skip-link"><a class="assistive-text" href="#content" title="<?php esc_attr_e('Skip to primary content', 'twentyeleven'); ?>"><?php _e('Skip to primary content', 'twentyeleven'); ?></a></div> 
       <div class="skip-link"><a class="assistive-text" href="#secondary" title="<?php esc_attr_e('Skip to secondary content', 'twentyeleven'); ?>"><?php _e('Skip to secondary content', 'twentyeleven'); ?></a></div> 
       <?php /* Our navigation menu. If one isn't filled out, wp_nav_menu falls back to wp_page_menu. The menu assiged to the primary position is the one used. If none is assigned, the menu with the lowest ID is used. */ ?> 
       <?php wp_nav_menu(array('theme_location' => 'primary')); ?> 
      </nav><!-- #access --> 
    </header><!-- #branding --> 


    <div id="main"> 
+0

你做错的第一件事就是出一大堆PHP的时候你的问题是关于如何JS,CSS和HTML与相互影响。 – Quentin 2012-02-15 13:51:13

+0

对不起,这是你做错的第二件事。你做错的第一件事就是使用客户端JS来确定在页面上显示的内容,而不是在PHP中执行。 – Quentin 2012-02-15 13:52:17

+0

第二个代码块将在必要时提供上下文。事先不知道是否有人会要求。 如果您的意见不具有建设性,请不要在将来发布它们。谢谢 – jorrebor 2012-02-15 14:03:55

回答

2

的“知名度”应为“隐藏”,当你希望它被隐藏的价值。 “无”值适用于“显示”。