Question

$(function() {
    $(".popup").hide();
    $(".clickMe").mouseover(function () {       
        $(".popup").show();
    }).mouseout(function() {
        $(".popup").hide();//Set this to default hide
    }); 
});

<script type="text/javascript"src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>

<a class="clickMe" href="#"> Click here to see hidden item.</>
<div class="popup"> You've found me! </div>

我发现这个代码我很乐意实现，但不确定如何。而不是鼠标悬停，我如何将其设置为onclick调用？谢谢你的时间。

Answer 1

这样做

$(function() { 
  $(".popup").hide();                 //Hide the popup first
  $(".clickMe").click(function () {   //Attach a click event to the .clickMe
        $(".popup").toggle();              //Toggle the visibility of the popup
  });
});

所以我所做的就是为mouseover类的元素更改单个mouseout事件的click和.clickMe个事件。然后使用jQuery toggle效果，它将显示或显示div，具体取决于它是否已经可见，因此“切换”div。查看here了解更多信息

Javascript onclick而不是鼠标悬停

1 个答案: