我的
JavaScript文件的大小是因为我有数百个链接而失控,每个都有自己的jQuery函数,即使它们基本上都是相同的任务.
这是一个简短的摘录:
- $("#link1").click(function ()
- {
- $(".myDiv").hide();
- $("#myDiv1").toggle();
- });
- $("#link2").click(function ()
- {
- $(".myDiv").hide();
- $("#myDiv2").toggle();
- });
- $("#link3").click(function ()
- {
- $(".myDiv").hide();
- $("#myDiv3").toggle();
- });
有没有办法抽象一些逻辑,所以我只有一个功能,而不是数百个做同样的事情?
解决方法
您可以向所有执行相同操作的链接添加一个类,并在该类上使用jQuery.
- <a href='whatever' id='link_1' class='toggler'>text</a>
- <a href='whatever' id='link_2' class='toggler'>text</a>
jQuery代码将是:
- $(".toggler").click( function(){
- // toggle the divs
- var number = $(this).attr("id").split('_')[1];
- $(".myDiv").hide();
- $("#myDiv"+ number).toggle();
- });