javascript—在jquery中对多个单击事件执行相同的功能

lymgl2op  于 2021-09-23  发布在  Java
关注(0)|答案(2)|浏览(207)
$(document).on('click','#closeNewProductExpand', function() {

        $('#newProductExpand').css('width', '0');
    });

    $(document).on('click', '#searchProduct', function() {

        $('#newProductExpand').css('width', '0');
    });

    $(document).on('click', '#productsData', function() {

        $('#newProductExpand').css('width', '0');
    });

在这里,如果单击上述3个按钮之一,我想将#newproductexpand的宽度设置为0。是否有任何方法可以编写此代码而不浪费如此大的空间。我感谢您的帮助。谢谢

gkl3eglg

gkl3eglg1#

您可以为元素提供一个类,并简单地将该类作为目标,以使其更容易,而不是逐个将元素ID作为目标
这样地:

$('.className').click(function(){
   $('#newProductExpand').css('width', '0');         
});
zphenhs4

zphenhs42#

可以将选择器与逗号组合。

$(document).on('click','#closeNewProductExpand, #searchProduct, #productsData', function() {
    $('#newProductExpand').css('width', '0');
});

但是,作为替代,我建议您为所有这些元素提供一个公共类,并将其用作选择器。这样,如果需要向集合中添加更多元素,只需给它们相同的类,而不需要每次都使选择器列表变长。

相关问题