Jquery 为什么'；不停地工作？

我不明白为什么在悬停文本时不显示图像。谁能告诉我哪里出了问题？我知道这些图片是在正确的路径上的，因为它们是在点击后下载的。除了常见的打字错误，我似乎在网上找不到任何东西，但我已经检查了好几次，并在linter中运行了它，但找不到任何东西

什么都行。提前谢谢

$(function () {
$('img[data-hover]').hover(function () {
    $(this).attr('tmp', $(this).attr('src')).attr('src', $(this).attr('data-   hover')).attr('data-hover', $(this).attr('tmp')).removeAttr('tmp');
}).each(function () {
    $('<img />').attr('src', $(this).attr('data-hover'));
});
});

$(document).ready(function () {
$('a.tip').imgPreview({
    containerID: 'imgPreviewWithStyles',
    /* Change srcAttr to rel: */
    srcAttr: 'rel'
});
});

(function ($) {
$.expr[':'].linkingToImage = function (elem, index, match) {
    // This will return true if the specified attribute contains a valid link to an image:
    return !!($(elem).attr(match[3]) && $(elem).attr(match[3]).match(/\.(gif|jpe?g|png|bmp)$/i));
};

$.fn.imgPreview = function (userDefinedSettings) {

    var s = $.extend({

        /* DEFAULTS */

        // CSS to be applied to image:
        imgCSS: {},
        // Distance between cursor and preview:
        distanceFromCursor: { top: 10, left: 10 },
        // Boolean, whether or not to preload images:
        preloadImages: true,
        // Callback: run when link is hovered: container is shown:
        onShow: function () { },
        // Callback: container is hidden:
        onHide: function () { },
        // Callback: Run when image within container has loaded:
        onLoad: function () { $(this).delay(5000).fadeOut(500); },
        // ID to give to container (for CSS styling):
        containerID: 'imgPreviewContainer',
        // Class to be given to container while image is loading:
        containerLoadingClass: 'loading',
        // Prefix (if using thumbnails), e.g. 'thumb_'
        thumbPrefix: '',
        // Where to retrieve the image from:
        srcAttr: 'rel'

    }, userDefinedSettings),

    $container = $('<div/>').attr('id', s.containerID)
                    .append('<img/>').hide()
                    .css('position', 'absolute')
                    .appendTo('body'),

    $img = $('img', $container).css(s.imgCSS),

    // Get all valid elements (linking to images / ATTR with image link):
    $collection = this.filter(':linkingToImage(' + s.srcAttr + ')');

    // Re-usable means to add prefix (from setting):
    function addPrefix(src) {
        if (src !== null) {
            return src.replace(/(\/?)([^\/]+)$/, '$1' + s.thumbPrefix + '$2');
        }
    }
    if (s.preloadImages) {
        (function (i) {
            var tempIMG = new Image(),
                callee = arguments.callee;
            tempIMG.src = addPrefix($($collection[i]).attr(s.srcAttr));
            tempIMG.onload = function () {
                $collection[i + 1] && callee(i + 1);
            };
        })(0);
    }

    $collection
        .mousemove(function (e) {

            $container.css({
                top: e.pageY + s.distanceFromCursor.top + 'px',
                left: e.pageX + s.distanceFromCursor.left + 'px'
            });
        })
        .hover(function () {

            var link = this;
            $container
                .addClass(s.containerLoadingClass)
                .show();
            $img
                .load(function () {
                    $container.removeClass(s.containerLoadingClass);
                    $img.show();
                    s.onLoad.call($img[0], link);
                })
                .attr('src', addPrefix($(link).attr(s.srcAttr)));
            s.onShow.call($container[0], link);

        }, function () {
            $container.hide();
            $img.unbind('load').attr('src', '').hide();
            s.onHide.call($container[0], this);
        });

    // Return full selection, not $collection!
    return this;
};

})(jQuery);

$（函数（）{
$（'img[data hover]'）。悬停（函数（）{
$（this.attr（'tmp'，$（this.attr（'src'））.attr（'src'，$（this.attr（'data-hover'））.attr（'data-hover'，$（this.attr（'tmp'））.removeAttr（'tmp'）；
}).每个（功能）{
$（''）.attr（'id'，s.containerID）
.append（“确保选择器工作正常。如果不查看HTML，我无法确定，但是jQuery选择器
selector[x=？]”
选择器的工作方式是查找与属性
x=“？”
匹配的所有元素

例如，选择器
img[height=100]
将选择高度属性设置为100的所有图像


现在，在您的例子中，您有了选择器
img[data hover]
，它将选择设置了数据悬停属性的所有图像，例如

<img src="..." data-hover=""/>


在这个JSFIDLE示例中，您可以看到上面提到的内容。因为两个图像都设置了高度属性，所以它们在悬停时都会失去不透明度，但因为底部的图像是唯一高度设置为200的图像，所以它是唯一在悬停时反转的图像。
您确定选择器正在选择您想要的元素吗？通常是这样的用
[data attribute=？]
完成。我从来没有见过只
[data hover]
@David在玩它。我很肯定这就是问题所在。悬停尝试工作，但没有得到图像，而是得到默认的“missing image”图标。你能进一步解释一下[data attribute=？]可以吗？这是一个输入错误吗？
$（this）.attr（'data-hover'）
在“data”和“hover”之间不应该有空格@David谢谢你的帮助！非常好的反馈。那么我应该添加属性data hover=“”要镜像？这是我现在拥有的html。
@Dan1121当我复制/粘贴代码时发生的，我是堆栈溢出新手。。
$("img").hover(function(){});