Question

我正在尝试使用基础框架从头开始创建一个主题，它开箱即用，但是当我需要包含基础JavaScript脚本时，它显示好像已经加载，但没有任何工作，首先顶部栏不起作用，我试图取消注册预先加载WordPress的jquery，并使用谷歌cdn中的那个，因为我已经读过，这是顶栏和其他脚本工作的可靠方法，但是到目前为止没有任何作品

这是我在functions.php中的代码

 // Enqueue scripts essential for foundation framework to act responsive

function responsive_scripts_basic()  
{  
    //register scripts for our theme  
    wp_deregister_script('jquery');

    wp_register_script('foundation-mod',  get_template_directory_uri() . '/javascripts/vendor/custom.modernizer.js',    
true );  
     wp_register_script('foundation-topbar', get_template_directory_uri() . '/javascripts/foundation/foundation.topbar.js',
 true );  
    wp_register_script('foundation-main', get_template_directory_uri() . '/javascripts/foundation/foundation.js', 
true );  
    wp_register_script('zepto', get_template_directory_uri() . '/javascripts/vendor/zepto.js', 

true );
     wp_register_script('jquery','http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js', 
 true );


    //enqueue scripts for our theme
    wp_enqueue_script( 'foundation-mod' );  
    wp_enqueue_script( 'foundation-topbar' );  
    wp_enqueue_script( 'foundation-main' );  
    wp_enqueue_script( 'zepto');
    wp_enqueue_script( 'jquery');
}  
add_action( 'wp_enqueue_scripts', 'responsive_scripts_basic' );

我对样式表使用了相同的方法，没有任何问题，对此有什么经验？我认为使用这个框架构建一个主题会很容易，但公平地变得相当复杂。

Answer 1

js文件“排队”的顺序非常重要。

首先你将“现代化者”排队，然后是jQuery / zepto，然后是Foundation.min.js，然后是topbar扩展名：

//enqueue scripts for our theme
wp_enqueue_script( 'foundation-mod' );  
wp_enqueue_script( 'jquery');
wp_enqueue_script( 'foundation-main' );  
wp_enqueue_script( 'foundation-topbar' );

请参阅zurb Foundation Installation docs，并记住脚本的顺序。

同样为了开始基础工作，你需要一个脚本元素，最有可能在PHP生成HTML的最后：

<script type="text/javascript">
    $(document).foundation();
</script>

由于wordpress是（据我所知）将jQuery推入noConflict模式，你可能需要写这个

<script type="text/javascript">
    jQuery(document).foundation();
</script>

编辑：Zepto没有noConflict函数，留下$是jQuery或者它设置的任何东西。为了简单起见，请选择jQuery并使用完全限定的jQuery(document).foundation()语法！

基础javascript的wordpress主题

1 个答案: