Question

我有一个标签式脚本，其上有悬停的开关标签。由于链接很接近，我想在触发悬停功能之前有一个延迟，因此当用户“触摸”其余链接时，内容不会切换得那么快。

也许有setTmeout？这是我的剧本，我该怎么做？

$(".HotelPanel_content").hide(); //Hide all content
$("ul.HotelPanelNav li:first").addClass("active").show(); //Activate first tab
$(".HotelPanel_content:first").show(); //Show first tab content


$("ul.HotelPanelNav li").hover(function() {
    $("ul.HotelPanelNav li").removeClass("active"); //Remove any "active" class
    $(this).addClass("active"); //Add "active" class to selected tab
    $(".HotelPanel_content").hide(); //Hide all tab content
    var activeTab = $(this).find("a").attr("id"); //Find the rel attribute value to identify the active tab + content
    $(activeTab).slideDown("slow"); //Fade in the active content
    return false;
});

});

Answer 1

试试这个：

var thisCache;
var hoverTimeout;
$("ul.HotelPanelNav li").mouseenter(function() {
    thisCache = $(this);
    hoverTimeout = setTimeout(function(){
        $("ul.HotelPanelNav li").removeClass("active"); //Remove any "active" class
        thisCache.addClass("active"); //Add "active" class to selected tab
        $(".HotelPanel_content").hide(); //Hide all tab content
        var activeTab = thisCache.find("a").attr("id"); //Find the rel attribute value to identify the active tab + content
        $(activeTab).slideDown("slow"); //Fade in the active content
        },300)
    });
$("ul.HotelPanelNav li").mouseleave(function(){
    clearTimeout(hoverTimeout)
})

Answer 2

您可以将.delay（）添加到任何jquery动画方法。此方法需要一段时间（以毫秒为单位），因此您可以在动画上执行此操作。

$(activeTab).delay(5000).slideDown("slow");

我相信你也可以推迟这个功能

$("ul.HotelPanelNav li").delay(5000).hover(function() {

修改

您也可以使用.timeout函数

window.setTimeout(function() { callYourFunction(); }, 1000);

修改2

这对我来说很好

<script type="text/javascript" src="jquery-1.4.2.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#somelink").hover(function(){ window.setTimeout(function() { //put your code here }, 1000); }); }); </script> </head> <body> <div id="flash"> </div> <div id="somelink"> Hello this is a div </div>

Answer 3

也许你可以这样做

$("ul.HotelPanelNav li").hover(function() {
   settTimeout('yourfunction($this);', time)
});

function yourfunction(element){
  $("ul.HotelPanelNav li").removeClass("active"); //Remove any "active" class
  $(this).addClass("active"); //Add "active" class to selected tab
  $(".HotelPanel_content").hide(); //Hide all tab content
  var activeTab = $(this).find("a").attr("id"); //Find the rel attribute value to identify the active tab + content
  $(activeTab).slideDown("slow"); //Fade in the active content
  return false;
}

用于悬停链接的jQuery setTimeout？

3 个答案: