javascript - 从悬停到点击的 Java 脚本

Question

如何将此脚本从悬停更改为 onclick：

$j=jQuery.noConflict();
$j(document).ready(function() { 
    $j(".swatch-anchor").hover(function() {
        var newTitle = $j(this).attr("title");
        $j("#colour-name").html(newTitle);
    },
    function() {
        var swapTitle = $j("#colour-name").html();
        $j(this).attr("title",swapTitle);
        $j("#colour-name").html("");
    });
});

有人建议将 .hover 更改为 .click ，但这不起作用。

有更好的建议吗？

Answer 1

出色地，

这应该工作：

$j = jQuery.noConflict();
$j(document).ready(function () {
    $j(".swatch-anchor").on('click',function () {
        var newTitle = $j(this).attr("title");
        $j("#colour-name").html(newTitle);
    });
});

但是您丢失了在鼠标离开时执行的这段代码，因为 jQuery 的.hover()有一个 没有的handlerOut可选函数。click

var swapTitle = $j("#colour-name").html();
$j(this).attr("title",swapTitle);
$j("#colour-name").html("");

编辑：

尝试结合鼠标悬停和单击：

$j = jQuery.noConflict();
$j(document).ready(function () {
    $j(".swatch-anchor").on('click mouseenter',function () {
        var newTitle = $j(this).attr("title");
        $j("#colour-name").html(newTitle);
    });

    $j(".swatch-anchor").on('mouseleave',function () {
       var swapTitle = $j("#colour-name").html();
        $j("#colour-name").html("");
    });
});

Answer 2

尝试这个：

    $j=jQuery.noConflict();
    $j(document).ready(function() { 
       $j(".swatch-anchor").on("click", function() {
          var newTitle = $j(this).attr("title");
          $j("#colour-name").html(newTitle);
       });
    });