在 WordPress 中包含一个 jQuery 插件

Posted 2023-05-09

【中文标题】在 WordPress 中包含一个 jQuery 插件

【英文标题】：Including a jQuery plugin inside of WordPress

【发布时间】：2013-08-30 02:37:17

【问题描述】：

我目前正在将我的 html 转换为 WordPress 网站。该站点使用'inview' jQuery 插件。

我似乎无法让它在 WordPress 中运行。

我在 header.php 中插入了插件链接：src="js/jquery.inview.js"

以及footer.php中的以下内容：

<script type="text/jscript">
$('#seoHomeImage, #socialBar').bind('inview', function(event, visible) 
if (visible) 
$(this).stop().animate( opacity: 1 );
 else 
$(this).stop().animate( opacity: 0 );

);
</script>

我也有这个来自 Chris Coyiers Blank 主题，在功能中：

if ( !is_admin() ) 
   wp_deregister_script('jquery');
   wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"), false);
   wp_enqueue_script('jquery');

我必须以某种方式在功能页面中链接“inview”插件吗？

感谢您的关注:-)

【问题讨论】：

是否有控制台输出。可能脚本加载的顺序搞错了。

我无法将此标记为重复，因为the other one in not accepted and doesn't have any upvotes。但答案与我在这里提供的完全相同。简而言之：不要取消注册 WP 捆绑的 jQuery 并使用正确的钩子将 jQuery 加入队列并添加为您自己脚本的依赖项。

【参考方案1】：

当 DOM 完成事件时，您应该将此代码放入 document.ready 部分

    $(function () 
        $('#seoHomeImage, #socialBar').bind('inview', function(event, visible) 
            if (visible) 
                $(this).stop().animate( opacity: 1 );
             else 
                $(this).stop().animate( opacity: 0 );
            
        );
    );