Question

所以我有一堆网格格式的<li>。我有一些jquery设置允许你将鼠标悬停在li上，一组按钮显示在li上，有一些不同的选项。我让jquery运行正常，直到我将悬停选择器从<li>中的元素移动到整个<li>。现在似乎当我尝试将我的按钮附加到特定元素的li上时它似乎有效，它似乎附加到每个<li>而不仅仅是我正在悬停的那个。注意我试图用它来追加而这无效或者没有任何反应：

$.tmpl(quickbuttonTemplate).appendTo($(this).closest('.details');

所以我没有得到任何结果，所以我选择了这个，这就是我将它附加到每一个li而不仅仅是我正在盘旋的那个：

function quickView() {
    var quickbuttonTemplate = $('#quick-button-template').template();
    var quicklightTemplate = $('#quick-view-template').template();
    // Grid Hover Overlays
    $('.grid li').live('mouseover', function () {
        if (!$(this).data('init')) {
            $(this).data('init', true);
            $(this).hoverIntent(

            function () {
                $.tmpl(quickbuttonTemplate).appendTo($('.details'));
                $('.quick-container').css({
                    'width': $('.grid li').width() + "px",
                    'height': ($('.grid li').height() - 56) + "px"
                }).show();
            },

            function () {
                $('.quick-container').remove();
            });
            $(this).trigger('mouseover');
            interval: 20
        }
    });

这是我的HTML：

    <li data="{ id: Some number }">
    <div class="header">
        <h4><a href="/some url" title="some text">Header name</a></h4>
    </div>
    <div class="details">
        <div class="photo">
            <a href="some url" title="some text"><img src="some image" alt="some text"></a>

        </div>
        <div class="logo">
            <a href="some url" title="some text">
                <img src="/some url" width="50" height="25" alt="some text" title="some text">
            </a>
        </div>
        <div class="pricing clearfix">
            <span class="price">some price</span>
        </div>                                                
    </div>
    <div class="rating clearfix">
        <a href="some url" title="some text"><div class="rating-4" onclick="window.location='some url"></div></a>
        <a href="some url" title="some text" class="rating-count countLeft">29</a>                                       
    </div>
</li>

Answer 1

这样：

$.tmpl(quickbuttonTemplate).appendTo($(this).closest('.details');

不起作用b / c最近看起来向下看树，你想看看里面的$（这个）......

最近的文档： http://api.jquery.com/closest/

你可以使用.find

$.tmpl(quickbuttonTemplate).appendTo($(this).find('.details');

另外：如果你在一行中使用$（this），就像你一样，最好将它存储在一个局部变量中。即：

var $this = $(this);

Jquery附加问题

1 个答案: