0

我不确定我在这里做错了什么。我有一个 div，如果用户将鼠标悬停在该 div 部分并想在鼠标移出时关闭，我想打开一个弹出窗口。这是我的代码

<div class="topCart">
  some data
</div>

这是我的 JQuery 代码

$(".topCart").mouseover(function() {
    $.get('${rolloverPopupUrl}?bustcache=' + new Date().getTime(),
     function(result) {
        $('#viewCart').html(result);
        refreshMiniCart();
        });
    $('#viewCart').slideDown('slow');
    }).mouseout(function() {
     $('#viewCart').slideUp('fast');
   });

上面的代码不起作用，也没有给出任何 Ajax 调用来获取新数据，而如果我使用以下代码

$(document).ready(function(){
   $(".topCart").hover( function () {
    $('#viewCart').html("");
    $.get('${rolloverPopupUrl}?bustcache='+new Date().getTime(), function(result){
    $('#viewCart').html(result);
     refreshMiniCart();
    });
     if($('#viewCart').is(':hidden')){
        $('#viewCart').slideDown('slow'); }
        },
        function () {
            $('#viewCart').slideUp('fast');
        });
});

这段代码正在工作并且它正在获取数据，所以我看不到使用document.ready 我对 Jquery 的有限知识我试过但无法看到代码不工作的原因任何人都可以指出我的错误吗？

4

4 回答 4

0

第一个代码不起作用，因为在设置事件时并非所有 DOM 元素都被下载。它导致结果$(".topCart")为空。这不会引发任何错误，语法是正确的，问题是 jQuery 与 html 一起使用，但未完成。

$(document).ready(...)

或者 

$(function() {
 // Handler for .ready() called.
});
于 2012-10-31T12:18:42.970 回答
0 
$(document).ready(function() { 
    $(".topCart").mouseover(function() {
        ...
    }
});

您需要在事件触发之前使用 document.ready，在文档加载完所有 DOM 元素之后，您可以确定，否则您正在寻找尚未加载到 DOM 中的事件

于 2012-10-31T12:20:10.823 回答
0

在键入代码时尝试具有一些基本的结构和清洁度（接近虔诚），并且发现错误会容易得多：

$(function() {
    $(".topCart").on({
        mouseenter: function() {
            var elem = $('#viewCart');
            elem.empty();        
            $.get('${rolloverPopupUrl}?bustcache=' + new Date().getTime(), function(result) {
                elem.html(result);
                refreshMiniCart();
            });
            if (!elem.is(':visible')) elem.slideDown('slow');
        },
        mouseleave: function() {
            $('#viewCart').slideUp('fast');
        }
    });
});​
于 2012-10-31T12:21:06.287 回答
0

没有了$(document).ready()，第一个居然没有被束缚$('.topCart')。

第二个示例，使用准备好的文档给出了将函数绑定到悬停事件的时刻或时间。

于 2012-10-31T12:21:31.197 回答