我想将click（）更改为hover（）。
这些是我的代码。
HTML：
<nav id="menu" >
<div class="block">
<A HREF="index.php" class="logo">
<img src="images/logo.png" />
</A>
<div class="show_sub active05 menu">
Products & Solutions
<!-- <div class="tips">
<img src="images/menutip.png" />
<span>Who you are?</span>
</div> -->
</div>
<div class="show_sub active05 menu">Support</div>
<div class="show_sub active05 menu">Company</div>
<div class="show_sub active05 menu">Investor Relations</div>
<a href="contact.php" class="active05 menu">Contact</a>
<div class="search">
<form action="product_search.php" method="get" name="computerF" >
<input type="text" name="keyword" placeholder="Search Product">
<div class="button" onclick="javascript:document.computerF.submit();">
<img src="images/search.jpg" />
</div>
</form>
</div>
</div>
<div id="menu_down">
<div class="block">
<div class="name"><span>Products &<br /><b>Solutions</b></span></div>
<div class="link_block">
<div class="all_link">
<!-- START BLOCK : procate1 -->
<a href="product.php?id={id}" class="{p_active}">{catename}</a>
<!-- END BLOCK : procate1 -->
</div>
</div>
</div>
<div class="block">
<div class="name"><span>Support</span></div>
<div class="link_block">
<div class="all_link">
<a href="event.php" class="{event}">Events</a>
<a href="press.php" class="{press}">Press Release</a>
<a href="video.php" class="{video}">Video</a>
<a href="paper.php" class="{paper}">White Paper & Infographics</a>
<a href="about_RMA.php" class="{about_rma}">RMA Policy</a>
<a href="about_green.php" class="{about_green}">Green Policy</a>
<a href="about_step.php" class="{about_step}">One-stop Global Service</a>
<a href="about_care.php" class="{about_care}">Social Care</a>
<a href="about_dis.php" class="{about_dis}">Disclaimer</a>
</div>
</div>
</div>
<div class="block" >
<div class="name">
<span>
Company
</span>
</div>
<div class="link_block">
<div class="all_link">
<a href="about.php" class="{about}">Who are we</a>
<a href="about_do.php" class="{about_do}">What we do</a>
<a href="about_with.php" class="{about_with}">Careers</a>
<a href="about_Cert.php" class="{about_cert}">Certification</a>
</div>
</div>
</div>
<div class="block three_tree" >
<div class="name"><span>Investor<br /><b>Relations</b></span></div>
<div class="link_block">
<div class="all_link">
<a href="investor.php" class="{investor}" >Material Information</a>
<a href="investor_org.php" class="{investor_org}" >Company Organize and Structure</a>
<a href="investor_art.php" class="{investor_art}">Articles of Association</a>
<a href="investor_Int.php" class="{investor_int}">Internal Audit</a>
<a href="investor_report.php" class="{investor_report}">Sales Report</a>
<a href="investor_divid.php" class="{investor_divid}">Dividend Information</a>
<a href="investor_proceed.php" class="{investor_proceed}">Proceedings of General Meeting</a>
<a href="investor_annual.php" class="{investor_annual}">Annual Report</a>
<a href="investor_stock.php" class="{investor_stock}">Stock Quotes</a>
<a href="investor_min.php" class="{investor_min}">Minutes from the Board Meeting</a>
<a href="investor_investor.php" class="{investor_investor}">Investor Conference</a>
<a href="investor_contact.php" class="{investor_contact}">Contact with Problems Processing</a>
</div>
</div>
</div>
</div>
和jQuery：
var nowclick=0;
$(".show_sub").click(function(){
$(".show_sub").removeClass("show_arrow");
clearTimeout(menut);
if(nowclick != $(".show_sub").index(this)){
$("#menu_down .block").hide();
$(".show_sub").removeClass("active");
}
nowclick=$(".show_sub").index(this);
$(this).toggleClass("active");
$("#menu_down .block").eq(nowclick).slideToggle();
$(this).addClass("show_arrow");
});
$("#menu #menu_down .block").hover(function(){
clearTimeout(menut);
},function(){
menut=setTimeout(function(){
$(".show_sub").removeClass("show_arrow");
$("#menu_down .block").hide('blind',500);
$(".show_sub").removeClass("active");
}, 880);
});
这是原始代码，我尝试了一些更改，但它没有用。 当然，我不能将其改为hover（）。
答案 0 :(得分：0)
我认为您只需将点击更改为悬停，请参阅代码段中的控制台
var nowclick=0;
$(".show_sub").hover(function(){
console.log('hovered')
$(".show_sub").removeClass("show_arrow");
clearTimeout(menut);
if(nowclick != $(".show_sub").index(this)){
$("#menu_down .block").hide();
$(".show_sub").removeClass("active");
}
nowclick=$(".show_sub").index(this);
$(this).toggleClass("active");
$("#menu_down .block").eq(nowclick).slideToggle();
$(this).addClass("show_arrow");
});
$("#menu #menu_down .block").hover(function(){
clearTimeout(menut);
},function(){
menut=setTimeout(function(){
$(".show_sub").removeClass("show_arrow");
$("#menu_down .block").hide('blind',500);
$(".show_sub").removeClass("active");
}, 880);
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<nav id="menu" >
<div class="block">
<A HREF="index.php" class="logo">
<img src="images/logo.png" />
</A>
<div class="show_sub active05 menu">
Products & Solutions
<!-- <div class="tips">
<img src="images/menutip.png" />
<span>Who you are?</span>
</div> -->
</div>
<div class="show_sub active05 menu">Support</div>
<div class="show_sub active05 menu">Company</div>
<div class="show_sub active05 menu">Investor Relations</div>
<a href="contact.php" class="active05 menu">Contact</a>
<div class="search">
<form action="product_search.php" method="get" name="computerF" >
<input type="text" name="keyword" placeholder="Search Product">
<div class="button" onclick="javascript:document.computerF.submit();">
<img src="images/search.jpg" />
</div>
</form>
</div>
</div>
<div id="menu_down">
<div class="block">
<div class="name"><span>Products &<br /><b>Solutions</b></span></div>
<div class="link_block">
<div class="all_link">
<!-- START BLOCK : procate1 -->
<a href="product.php?id={id}" class="{p_active}">{catename}</a>
<!-- END BLOCK : procate1 -->
</div>
</div>
</div>
<div class="block">
<div class="name"><span>Support</span></div>
<div class="link_block">
<div class="all_link">
<a href="event.php" class="{event}">Events</a>
<a href="press.php" class="{press}">Press Release</a>
<a href="video.php" class="{video}">Video</a>
<a href="paper.php" class="{paper}">White Paper & Infographics</a>
<a href="about_RMA.php" class="{about_rma}">RMA Policy</a>
<a href="about_green.php" class="{about_green}">Green Policy</a>
<a href="about_step.php" class="{about_step}">One-stop Global Service</a>
<a href="about_care.php" class="{about_care}">Social Care</a>
<a href="about_dis.php" class="{about_dis}">Disclaimer</a>
</div>
</div>
</div>
<div class="block" >
<div class="name">
<span>
Company
</span>
</div>
<div class="link_block">
<div class="all_link">
<a href="about.php" class="{about}">Who are we</a>
<a href="about_do.php" class="{about_do}">What we do</a>
<a href="about_with.php" class="{about_with}">Careers</a>
<a href="about_Cert.php" class="{about_cert}">Certification</a>
</div>
</div>
</div>
<div class="block three_tree" >
<div class="name"><span>Investor<br /><b>Relations</b></span></div>
<div class="link_block">
<div class="all_link">
<a href="investor.php" class="{investor}" >Material Information</a>
<a href="investor_org.php" class="{investor_org}" >Company Organize and Structure</a>
<a href="investor_art.php" class="{investor_art}">Articles of Association</a>
<a href="investor_Int.php" class="{investor_int}">Internal Audit</a>
<a href="investor_report.php" class="{investor_report}">Sales Report</a>
<a href="investor_divid.php" class="{investor_divid}">Dividend Information</a>
<a href="investor_proceed.php" class="{investor_proceed}">Proceedings of General Meeting</a>
<a href="investor_annual.php" class="{investor_annual}">Annual Report</a>
<a href="investor_stock.php" class="{investor_stock}">Stock Quotes</a>
<a href="investor_min.php" class="{investor_min}">Minutes from the Board Meeting</a>
<a href="investor_investor.php" class="{investor_investor}">Investor Conference</a>
<a href="investor_contact.php" class="{investor_contact}">Contact with Problems Processing</a>
</div>
</div>
</div>