javascript 即使其他加载的 jQuery 函数正在运行，自定义 jQuery 函数也无法在 WordPress 上运行
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21948053/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Custom jQuery-function not working on WordPress even though other loaded jQuery functions are working
提问by Beginner
I'm using WordPress 3.8.1. I want to use this function to use sticky header
我正在使用 WordPress 3.8.1。我想用这个功能来使用粘性标题
<script>
$(document).ready(function() {
var $header = $("header"),
$clone = $header.before($header.clone().addClass("clone"));
$(window).on("scroll", function() {
var fromTop = $(window).scrollTop();
console.log(fromTop);
$("body").toggleClass("down", (fromTop > 200));
});
});
</script>
But it is not working for me and I don't know why. I know that jQuery is shared to my WordPress because Flexslider 2 is now working fine.
但它对我不起作用，我不知道为什么。我知道 jQuery 与我的 WordPress 共享，因为 Flexslider 2 现在工作正常。
回答by Mayur Devmurari
Add this:
添加这个：
var j = jQuery.noConflict();
Now you can write your jQuery code like this:
现在你可以像这样编写你的 jQuery 代码：
j(document).ready(function(){
j('.class').event(function(){
// your action............
});
});
Just assign the noConflict()function to a variable, and use that variable instead of $seen in jQuery code.
只需将noConflict()函数分配给一个变量，并使用该变量而不是$在 jQuery 代码中看到。
回答by hyperdrive
Don't run your jquery in a script. This will break other scripts in wordpress.
不要在脚本中运行您的 jquery。这将破坏 wordpress 中的其他脚本。
Make a .js file and include it in your functions.php file like this.
制作一个 .js 文件并将其包含在您的 functions.php 文件中，如下所示。
*/**
* Proper way to enqueue scripts and styles
*/
function theme_name_scripts() {
wp_enqueue_style( 'style-name', get_stylesheet_uri() );
wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/example.js', array('jquery'), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );*
Then in your .js file wrap your code in a No Conflict wrapper. Using $() will return undefined otherwise.
然后在您的 .js 文件中将您的代码包装在 No Conflict 包装器中。否则使用 $() 将返回 undefined 。
jQuery(document).ready(function($) {
var $header = $("header"),
$clone = $header.before($header.clone().addClass("clone"));
$(window).on("scroll", function() {
var fromTop = $(window).scrollTop();
console.log(fromTop);
$("body").toggleClass("down", (fromTop > 200));
});
});
回答by random_user_name
Late to the party here, but the correct solution to this is:
在这里聚会迟到了，但正确的解决方案是：
Understand that in WordPress, jQuery is loaded in no conflictmode. This means that the $variable is notreferencing jQuery.
了解在 WordPress 中，jQuery 以无冲突模式加载。这意味着该$变量没有引用 jQuery。
But, by modifying your script to use a no-conflict-safe document ready, you can use the $within the function.
但是，通过修改您的脚本以使用准备好的无冲突安全文档，您可以$在函数内使用。
Modify your script as follows:
修改你的脚本如下：
// original code - doesn't work, because $ is not jQuery in WordPress
// $(document).ready(function() {
// shorthand no-conflict-safe document ready:
jQuery(function($) {
// Now $ is safe to use - it references jQuery within this doc ready function
var $header = $("header"),
$clone = $header.before($header.clone().addClass("clone"));
$(window).on("scroll", function() {
var fromTop = $(window).scrollTop();
console.log(fromTop);
$("body").toggleClass("down", (fromTop > 200));
});
});
回答by INDERJEET VASHISTA
Have you tried setting the jquery file in your header (assuming you have the jquery file in your templates folder, but it can be anywhere, as long as you reference it correctly):
您是否尝试过在标题中设置 jquery 文件（假设您的模板文件夹中有 jquery 文件，但它可以在任何地方，只要您正确引用它）：
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery-1.3.2.min.js"></script>
Example
例子
$(document).ready(function(){
$("#container").alert("blah");
$(".goodshelf_ul li:first").css("border-top: none;");
$(".custom_ul li:first").addClass("first");
$("#footer .frame:last").css("margin: 0;");
$("#footer .frame:last").addClass("last");
});
I use jquery on all my wordpress sites and it works fine hope this helps.
我在我所有的 wordpress 网站上都使用 jquery，它工作正常，希望这会有所帮助。
