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


Global Variable in Functions.php Then Use in Javascript (WordPress)

很抱歉,如果这是错误的地方。实际上,这已经被另一个用户问过了(尽管它不是同一个问题),据说这是一个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

我正在使用一个空白/启动主题下划线。me

解决了: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(第二个粗体部分)吗?这是双向的…我需要更多地了解变量作用域

相关文章: