javascript - 如何简化这个js?

标签 javascript simplify

<分区>

我知道解决方案过于愚蠢,但我没有找到它:/ 我正在寻求简化此 js 代码。

但我特别希望了解,所以如果您有学习简化的链接。

我开始编写 JS,所以不要对我评价太多;)

提前致谢。

代码Js:

$('#img1, #menu1').hover(
    function() {
        $('#menu1').toggleClass("activeMenu");
        $('#img1').toggleClass("activeImg"); 
});

$('#img2, #menu2').hover(
    function() {
        $('#menu2').toggleClass("activeMenu");
        $('#img2').toggleClass("activeImg"); 
});
$('#img3, #menu3').hover(
    function() {
        $('#menu3').toggleClass("activeMenu");
        $('#img3').toggleClass("activeImg");  
});
$('#img4, #menu4').hover(
    function() {
        $('#menu4').toggleClass("activeMenu");
        $('#img4').toggleClass("activeImg"); 
});
$('#img5, #menu5').hover(
    function() {
        $('#menu5').toggleClass("activeMenu");
        $('#img5').toggleClass("activeImg");  
});

HTML 代码:

 <ul>               
    <li id="menu1">Module Accueil</li>
    <li id="menu2">Module Produit</li>
    <li id="menu3">Module Diaporama</li>
    <li id="menu4">Module Article</li>
    <li id="menu5">Module Contact</li>
</ul>
<img id="img1" src="/themes/courant/images/image1">
<img id="img2" src="/themes/courant/images/image2">
<img id="img3" src="/themes/courant/images/image3">
<img id="img4" src="/themes/courant/images/image4">
<img id="img5" src="/themes/courant/images/image5">

最佳答案

简单尝试

$('ul li[id^=]').hover( function() {
    $( this ).toggleClass("activeMenu");
});
$('img[id^="img"]').hover( function() {
    $( this ).toggleClass("activeImg");
});

关于javascript - 如何简化这个js?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46668684/

相关文章:

javascript - jquery toggle img 单击并在单击时从本地存储中存储或删除 img id

c# - 如何简化我的代码? (在行列表中搜索最小和最大坐标)

java - 简化在Java静态方法中用 "today"和 "yesterday"字符串替换日期对象

c - 如何简化这段代码并使其成为函数?

java - 如何创建一个 Java 方法来简化分数?

sympy - 在 Sympy 中定义符号的范围

javascript - 从按钮调用 javascript 函数会在我的 ASP.net 中隐藏 FullCalendar

JavaScript 到 Silverlight : await task based method

javascript - 协助 JS 应用程序,其中公式结果末尾有一堆 9

javascript - 使用 Selenium 和 PhantomJS 测试 AngularJS 应用程序