Question

我有这个jQuery脚本：

$('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'));

});

它工作正常，当我在图像上方时，悬停工作正常。

但现在我需要再次开始悬停，当我点击某些方框时，在那些：

$('#first, #second, #third').click(function(){  .....

以某种方式可以“点击”启动悬停并保持实际的悬停功能吗？或者甚至将其修改为“功能”？

我试过了，但我失败了谢谢。

编辑：
这是包含图像的HTML代码：

<div class="auswahlbox">
        <div class="auswahl" id="first" data-id="1">
            <div class="bild">
                <img src="https://image.jpg" data-hover="https://images_hover.jpg" />
            </div>
            <div class="box">
                <p>Text</p>
            </div>
        </div>
        <div class="auswahl" id="second" data-id="2">
            <div class="bild">
                <img src="https://image.jpg" data-hover="https://images_hover.jpg" />
            </div>
            <div class="box">
                <p>Text</p>
            </div>
        </div>
        <div class="auswahl" id="third" data-id="3">
            <div class="bild">
                <img src="https://image.jpg" data-hover="https://images_hover.jpg" />
            </div>
            <div class="box">
                <p>Text</p>
            </div>
        </div>
    </div>

现在的情况：
当我在.bild中移动图像时，它工作正常。

我需要什么：
当我点击"<div class="auswahl" id="first" data-id="1">"（第二，第三）div时，图像的悬停应该“开始”一次。

Answer 1

你的意思是这样的：

$('#first, #second, #third').click(function(){
    $('img[data-hover]').trigger('mouseover');
});

点击#first, #second #third后会触发img[data-hover]上的悬停事件。

只需在同一div尝试触发图片：

$('#first, #second, #third').click(function(){
    $(this).find('img[data-hover]').trigger('mouseover');
});

JQuery - 单击并悬停在同一个函数上

1 个答案: