这可以简化脚本吗?

时间:2016-01-25 23:03:28

标签: jquery

以下是我正在运行以分离然后根据所选标签的ID附加一些标签内容的脚本的一部分,并且当从另一个页面链接到标签内容时我还需要使用url indexOf直。

这是我的工作,但我有20-30个这样的,想知道它是否可以缩短

// TAB 1 AND CONTENT TAB 1
   var mfltab1 = $('#tabcontent1 #homepagecolumns').detach();
    $('li#tab1').one('click',function(){
       $('#tabcontent1').append(mfltab1);
    });
    if ( document.location.href.indexOf('#1') > -1 ) {
       $('#tabcontent1').append(mfltab1);
    }

// TAB 2 AND CONTENT TAB 2
   var mfltab2 = $('#tabcontent2 #homepagecolumns').detach();
    $('li#tab2').one('click',function(){
       $('#tabcontent2').append(mfltab2);
    });
    if ( document.location.href.indexOf('#2') > -1 ) {
       $('#tabcontent2').append(mfltab2);
    }

等等TAB 3,TAB 4 ......直到TAB 20

我尝试了这个建议,但它不起作用,我可能会错误标记?

$(document).ready ( function(){ 
  var mfltab = [
    $('#tabcontent1 #homepagecolumns').detach(),
    $('#tabcontent2 #homepagecolumns').detach(),
    $('#tabcontent3 #homepagecolumns').detach(),
    $('#tabcontent4 #homepagecolumns').detach(),
    $('#tabcontent5 #homepagecolumns').detach(),
    $('#tabcontent6 #homepagecolumns').detach(),
    $('#tabcontent7 #homepagecolumns').detach(),
    $('#tabcontent8 #homepagecolumns').detach(),
    $('#tabcontent9 #homepagecolumns').detach(),
    $('#tabcontent10 #homepagecolumns').detach()
  ];

  for(var i = 1; i < 10; i++) {
    $('li#tab' + i).one('click',function(){
        $('#tabcontent' + i).append(mfltab[i]);
    });
    if ( document.location.href.indexOf('#' + i) > -1 ) {
        $('#tabcontent' + i).append(mfltab[i]);
    }
  }
});

1 个答案:

答案 0 :(得分:2)

是...使用数组作为标签

var mfltab =[mfltab1, mfltab2, ..., mfltab20];

var mfltab = [
    $('#tabcontent1 #homepagecolumns').detach(),
    ....
    $('#tabcontent20 #homepagecolumns').detach()
];

然后使用字符串连接:

for(var i = 0; i < 20; i++) {
    $('li#tab' + i).one('click',function(){
        $('#tabcontent' + i).append(mfltab[i]);
    });
    if ( document.location.href.indexOf('#' + i) > -1 ) {
        $('#tabcontent' + i).append(mfltab[i]);
    }
}