Shorhand在JavaScript的代码具有相同的价值观

Question

我有不同的代码是这样的：

  $(function() { 

      $('#slider1').carouFredSel({ 
       auto: false, 
       infinite:false,     
       circular:false, 
       prev:'#prev1', 
       next:'#next1', 
       pagination:"#pager1", 
       mousewheel:true, 
       swipe: { 
        onMouse: true, 
        onTouch: true 
       } 
      }); 

     $('#slider2').carouFredSel({ 
       auto: false, 
       infinite:false,     
       circular:false, 
       prev:'#prev2', 
       next:'#next2', 
       pagination:"#pager2", 
       mousewheel:true, 
       swipe: { 
        onMouse: true, 
        onTouch: true 
       } 
      });   
     }); 

     window.addEvent('domready', function(){
 

    var container = document.id('container'), 
    queuedElems = []; 

    var sorter = new Fx.Sort($$('#container .sort'), { 
    duration: '1000', 
    transition: Fx.Transitions.Back.easeInOut, 
    mode: 'vertical', 
    onComplete: function(){ 
     displayDOM(); 
     } 
    }); 

    displayDOM(); 

    document.id('swap').addEvent('click', function(event){ 
    event.stop(); 
    var elems = container.getChildren(); 
    sorter.swap(elems[0], elems[elems.length - 1]); 
    }); 



    window.addEvent('domready', function(){ 

    var container = document.id('container2'), 
    queuedElems = []; 

    var sorter = new Fx.Sort($$('#container2 .sort'), { 
    duration: '1000', 
    transition: Fx.Transitions.Back.easeInOut, 
    mode: 'vertical', 
    onComplete: function(){ 
     displayDOM(); 
     } 
    }); 

    displayDOM(); 

    document.id('swap2').addEvent('click', function(event){ 
    event.stop(); 
    var elems = container.getChildren(); 
    sorter.swap(elems[0], elems[elems.length - 1]); 
    }); 

我想他们，因为每次在每个代码的设置要写入的“速记”方式同样，只有ID名称更改（ID1，ID2 ...）。我不知道如何在JavaScript中做到这一点（只在CSS中）。我唯一知道的是你需要'var'标签。

任何有一点知识的人都可以轻松做到。我尝试了很多组合，但总是失败。一个例子会很好。它困难吗？

Answer 1

你可以做两件事情： 使用,选择通过ID多个元件，或者指定一个普通类（.slider）

$('#slider1, #slider2').carouFredSel({ 
      auto: false, 
      infinite:false,     
      circular:false, 
      prev:'#prev1', 
      next:'#next1', 
      pagination:"#pager1", 
      mousewheel:true, 
      swipe: { 
       onMouse: true, 
       onTouch: true 
      } 
     }); 

或设置保存到一个变量

var mySettings = { 
      auto: false, 
      infinite:false,     
      circular:false, 
      prev:'#prev1', 
      next:'#next1', 
      pagination:"#pager1", 
      mousewheel:true, 
      swipe: { 
       onMouse: true, 
       onTouch: true 
      } 
     }; 
    $('#slider1').carouFredSel(mySettings); 

    $('#slider2').carouFredSel(mySettings); 

Answer 2

刚分配所有这些元素的通用类，并且同时为所有这些元素初始化插件 - 例如$('.slider')而不是$('#slider1')。