jQuery代码太长，需要帮助简化[关闭]

osh3o9ms 于 2023-11-17 发布在 jQuery

关注(0)|答案(2)|浏览(139)

已关闭。此问题需要更多focused。目前不接受回答。
**要改进此问题吗？**更新此问题，使其仅针对editing this post的一个问题。

29天前关闭
Improve this question的
这段代码是工作，但我希望得到这个简化。我不知道如何使这个工作在一个非常简单的方式。期待大家的帮助。任何想法都欢迎。

jQuery("#state-of-the-art .fl-tabs-label").click(function() {
    stateOftheArt();
});
jQuery("#everything-you-need .fl-tabs-label").click(function() {
    everythingYouNeed();
});
jQuery("#monitor-your-sites .fl-tabs-label").click(function() {
    monitorYourSites();
});
function stateOftheArt() {
    jQuery("#state-of-the-art .fl-tabs-panel").addClass("tab-animation-fadeup");
    setTimeout(function () {
        jQuery("#state-of-the-art .fl-tabs-panel").removeClass("tab-animation-fadeup");
    }, 400);
    return
}
function everythingYouNeed() {
    jQuery("#everything-you-need .fl-tabs-panel").addClass("tab-animation-fadeup");
    setTimeout(function () {
        jQuery("#everything-you-need .fl-tabs-panel").removeClass("tab-animation-fadeup");
    }, 400);
    return
}
function monitorYourSites() {
    jQuery("#monitor-your-sites .fl-tabs-panel").addClass("tab-animation-fadeup");
    setTimeout(function () {
        jQuery("#monitor-your-sites .fl-tabs-panel").removeClass("tab-animation-fadeup");
    }, 400);
    return
}

字符串

jquery

来源：https://stackoverflow.com/questions/77322078/jquery-code-is-too-long-need-help-to-simplify

2条答案

按热度按时间

gopyfrb31#

没有你的html代码，我只能猜测，但这可能是一个解决方案：

function tabAnimation(obj) {
    var _obj = jQuery(obj);
    _obj.addClass("tab-animation-fadeup");
    setTimeout(function () {
        _obj.removeClass("tab-animation-fadeup");
    }, 400);
}
jQuery(".fl-tabs-label").click(function () {
    tabAnimation(this);
});

字符串
您可以在click函数中移动tabAnimation的内容。

Demo

function tabAnimation(obj) {
    var _obj = jQuery(obj);
    _obj.addClass("tab-animation-fadeup");
    setTimeout(function () {
        _obj.removeClass("tab-animation-fadeup");
    }, 400);
}
jQuery(".fl-tabs-label").click(function () {
    tabAnimation(this);
});

.tab-animation-fadeup{
  color:red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="fl-tabs-label">
  div1
</div>
<div class="fl-tabs-label">
  div2
</div>
<div class="fl-tabs-label">
  div3
</div>

的字符串

展开查看全部

赞(0）回复(0）举报 2023-11-17

cqoc49vn2#

你可以创建一个函数，把你的html元素作为参数。

function anyFunction(element) {
    jQuery(`${element} .fl-tabs-panel`).addClass("tab-animation-fadeup");
    setTimeout(function () {
      jQuery(`${element} .fl-tabs-panel").removeClass("tab-animation-fadeup`);
    }, 400);
}
//call that function 
jQuery("#state-of-the-art .fl-tabs-label").click(function() {
    anyFunction('#state-of-the-art')
});
jQuery("#everything-you-need .fl-tabs-label").click(function() {
    anyFunction('#everything-you-need')
});
jQuery("#monitor-your-sites .fl-tabs-label").click(function() {
    anyFunction('#monitor-your-sites')
});

字符串

展开查看全部

赞(0）回复(0）举报 2023-11-17

我来回答

jQuery代码太长，需要帮助简化[关闭]

2条答案

相关问题

热门标签

最新问答