Functions.php中的全局变量然后在Javascript中使用(WordPress)

时间:2013-04-10 23:01:51

标签: php wordpress global-variables

如果这是错误的地方,我很抱歉。实际上这是另一个用户之前已经问过的问题(虽然问题不一样),据说这是一个PHP问题。不幸的是,我在PHP中实现答案还不够好。

以下是[上一个问题]:https://wordpress.stackexchange.com/questions/82503/cant-get-options-with-datavariable

我面临同样的问题。在我的选项中,我有一个滑块的选项(动画 - 淡入淡出或幻灯片)然后我想使用选项中存储的值并将其传递到我的function.php中的Javascript。

在选项文件中,我有以下代码:

// Slider animation options
        $of_options_slider_animation = array(
            "fade" => __("Fade", "themename"),
            "slide" => __("Slide", "themename")
        );

$of_options[] = array(  "name" => __("Slider Animation", "themename"),
                        "desc" => __("Select the type of animation for the slider.", "themename"),
                        "id" => "slider_animation",
                        "std" => "fade",
                        "type" => "radio",
                        "options" => $of_options_slider_animation

稍后我会将选项传递给functions.php中的js代码块,如下所示:

jQuery('.flexslider').flexslider({
                    controlNav: true,
                    directionNav: true,  
                    prevText: 'Previous',     
                    nextText: 'Next',
                    **animation: "<?php echo $smof_data['slider_animation']; ?>",**
                    animationLoop: false
                    // animation: "slide"
                  });

(请注意粗体部分)

但是,正如您可能预测的那样,它不起作用。

我尝试过像上一个问题中那样定义$ smof_data(参见上面的链接),但仍然没有运气。这是我的工作:

// Fetch options data
global $smof_data;
$smof_data = of_get_options("slider_animation");

请提前帮助,请提供帮助:)

编辑:

SMOF链接:https://github.com/sy4mil/Options-Framework

我使用了underscores.me

的空白/首发主题

1 个答案:

答案 0 :(得分:1)

解决它:D我直接在Javascript范围内使用变量。这是代码(以防万一)

function mytheme_flexslider() {

    if (!is_admin()) {

        // Enqueue FlexSlider JavaScript
        wp_register_script('jquery_flexslider', get_template_directory_uri(). '/js/jquery.flexslider-min.js', array('jquery') );
        wp_enqueue_script('jquery_flexslider');

        // Enqueue FlexSlider Stylesheet        
        wp_register_style( 'flexslider-style', get_template_directory_uri() . '/inc/flexslider/flexslider.css', 'all' );
        wp_enqueue_style( 'flexslider-style' );

        // FlexSlider custom settings       
        add_action('wp_footer', 'mytheme_flexslider_settings');

        function mytheme_flexslider_settings() { 
        // Fetch options data
        **global $smof_data;?>**

            <script>

                // Can also be used with $(document).ready()
                // flexslider have a fixed height
                jQuery(window).load(function() {
                  // jQuery('.subhead_shadow_bottom').hide();
                  jQuery('.flexslider').flexslider({
                    controlNav: true,
                    directionNav: true,  
                    prevText: 'Previous',     
                    nextText: 'Next',
                    animation: "<?php echo $smof_data['slider_animation']; ?>",
                    animationLoop: false
                    // animation: "slide"
                  });
                });


                jQuery(document).ready(function() {
                    fixFlexsliderHeight();
                });

                jQuery(window).load(function() {
                    fixFlexsliderHeight();
                }); // BUG: this ends up computing the slide height to the image height, not to the resized height, on page reload

                jQuery(window).resize(function() {
                    fixFlexsliderHeight();
                });


                function fixFlexsliderHeight() {
                    // Set fixed height based on the tallest slide
                    jQuery('.flexslider').each(function(){
                        var sliderHeight = 0;
                        jQuery(this).find('.slides > li').each(function(){
                            slideHeight = jQuery(this).height();
                            if (sliderHeight < slideHeight) {
                                sliderHeight = slideHeight;
                            }
                        });
                        // jQuery(this).find('ul.slides').css({'height' : sliderHeight});
                        // console.log("Fixing slider height to " + sliderHeight);
                    });
                }

                // jQuery(document).ready(function($){

                //  $('.flexslider').flexslider();
                // });
            </script>
        <?php 
        **// return $smof_data;**
        }

    }
}

add_action('init', 'mytheme_flexslider');

所有人现在都在工作。也许有一个小问题:我是否需要返回$ smof_data(第二个加粗的部分)?它有两种方式..我需要了解更多有关变量范围的信息..