Question

我的问题是我有两个功能，他们为不同的对象做同样的事情

这是代码。

$('body').on('click', '.toogle1', function() {
    $('body').find('.buttonshow').slideToggle(300);
    $('body').find('.buttonshow ').val(title);
});

$('body').on('click', '.toogle', function() {
    $('body').find('.htmlshow').slideToggle(400);
});

Answer 1

$('body').on('click', '.toggle, .toggle1', function(){ ... });

这将导致任何有课程“切换”的孩子的逻辑解雇。或者＆＃39; toggle1＆＃39;。

Answer 2

我不知道您的HTML代码，但是您在课程toggle的位置添加了第二课toggle1，因此最终课程将为class="toggle toggle1"，然后：

$('body').on('click', '.toogle1', function() {
    $('body').find('.buttonshow').slideToggle(300);
    $('body').find('.buttonshow ').val(title);
    $('body').find('.htmlshow').slideToggle(400);
});

但是如果你在这个类中有不同的CSS，请使用另一个答案。

Answer 3

只需创建一个您将使用的函数，而不是您最后传递的函数：

function toggleElement(selector, ms){
   selector.slideToggle(ms);
}

然后，您只需将其应用于您的jQuery

$('body').on('click', '.toogle1', function(){
     toggleElement($('.buttonshow'), 300);
     // Then, the rest of your logic that differs
});

所以基本上，这就是你在添加其他逻辑时使用同样功能的函数的方法，最好的方法是创建一个基本函数来完成将要重复的逻辑，然后，你在程序上编写其余的你的逻辑不同。这样，处理起来就容易得多。

我如何将两个Jquery函数放在一起？

3 个答案: