show() 和 hide() 的 jQuery 代码在控制台中工作，但在代码库中不起作用;抛出的错误说".show() and .hide() not a function"

Question

我添加了一个包含标题的新div，我想先隐藏它，然后在鼠标进入和鼠标离开时显示和隐藏它。这段代码在控制台中工作得很好，但在代码库中执行时却不能正常工作。

var optly = function() {
$('.nh-copy-wrap > .title').each(function() {
if ($(this).html().indexOf('Market to a person, not a segment')>-1 && $(this).hasClass('optly') == false) {
  $("<div class= "promo-h2">Personalization solutions help you tailor messages to match customers across devices and channels...</div>").insertAfter(this);
  $("div.nh-promo-card-holder:contains('Market to a person, not a segment')").find("div.nh-icon.ibm-arrow-forward-link").addClass("personalization-cta");
  $(".nh-icon.ibm-marketplace-link").addClass("marketplace-logo");
  $(this).addClass('optly');
}
else if ($(this).html().indexOf('Understand and engage in the mobile moment')>-1 && $(this).hasClass('optly') == false) {
  $("<div class= "promo-h2">Six billion mobile devices is a big target for marketers. Mobile marketing solutions allow marketers to engage customers...</div>").insertAfter(this);
  $("div.nh-promo-card-holder:contains('Understand and engage in the mobile moment')").find("div.nh-icon.ibm-arrow-forward-link").addClass("mobile-cta");
  $(".nh-icon.ibm-marketplace-link").addClass("marketplace-logo");
  $(this).addClass('optly');
}
else if ($(this).html().indexOf('Create high performing, highly-relevant emails')>-1 && $(this).hasClass('optly') == false) {
  $("<div class= "promo-h2">Six billion mobile devices is a big target for marketers. Mobile marketing solutions allow marketers to engage customers through these pervasive devices with...</div>").insertAfter(this);
  $("div.nh-promo-card-holder:contains('Create high performing, highly-relevant emails')").find("div.nh-icon.ibm-arrow-forward-link").addClass("email-cta");
  $(".nh-icon.ibm-marketplace-link").addClass("marketplace-logo");
  $(this).addClass('optly');
}
});
setInterval(optly, 50);
};
var HoverOver = function() {
$(".nh-promo-card-holder").bind("mouseenter", function() {$(".promo-    h2").show();});
$(".nh-promo-card-holder").bind("mouseleave", function() {$(".promo-h2").hide();});
};
$(document).ready(function() {
optly();
setInterval(HoverOver, 200);
});

我尝试使用$(document).ready，并等待直到新的div可用于操作之前执行下面的代码，但控制台仍然抛出一个错误，说"...show() is not a function"和类似的隐藏以及。有人能帮忙吗?

Answer 1

尝试将您的代码放入

$(document).ready(function(){

})

并在编写

Answer 2

听起来好像页面上还有别的东西在使用$

尝试将代码包装在:

(function($){
  /* your code */
})(jQuery);

也要确保在jQuery.js加载

之后加载注意，当找到

Answer 3

这很可能发生，因为jQuery还没有加载。使用jQuery的代码不能访问jQuery。结果是它不起作用。要解决这个问题，你必须像Alex Muravyov说的那样做:

$(document).ready(function(){
});