2012-05-29 57 views
0

我创建了一个jquery ligthbox只是为了学习,现在所有的作品都是greate,但是当我尝试调用插件两次以上时,附加内容重复其自身。jQuery文件准备后追加一次

搜索在这里,我发现这个代码:

var appened = true; 

if(appened){  
    //append code 
    appened = false; 
} 

但是,这并不为我工作。我必须做什么,以避免这种重复的内容?

以防万一这里是我的代码:

(function($){ 

$.fn.shareBox = function(options){ 

    var defaults = { 
     fadeSpeed : 500, 
     hiddenElement: false, 
     nameHideCont : ''//nombre del contenedor con clase hide 
     }, 
     settings = $.extend(defaults, options); 


     var appened = true; 

    if(appened){ 
      var lb = '<div class="lb-cont"></div><div class="sb-cont"></div>'; 
      $(lb).prependTo('body'); 

     appened = false; 
    } 


    var shareB = $('.sb-cont'); 


    shareB.css('display','none'); 


    this.each(function(){ 

    var obj = $(this); 
    var verMas = $('a', obj) 

    var lbw = shareB.width(); 



    obj.bind('click', function(){ 



     if(defaults.hiddenElement){ 
     var contenido = $('.'+defaults.nameHideCont, obj).clone(true, true).removeClass('hide'); 
     contenido.appendTo(shareB); 

     } 

     $('.lb-cont').fadeIn(defaults.fadeSpeed); 
     shareB.fadeIn(defaults.fadeSpeed); 
     shareB = $('.sb-cont'); 

     pos_obj(); 


     var cerrar = '<div id="cerrar-cont"><div id="cerrar">X</div></div>'; 
    $(cerrar).prependTo('.'+defaults.nameHideCont); 
     $('.imagess').epicZoom({}); 
     var urlFace = $('#facebook').attr('st_url'); 
     var titFace = $('#facebook').attr('st_title'); 
     var urlTwi = $('#twitter').attr('st_url'); 
     var titTwi = $('#twitter').attr('st_title'); 
     var urlSha = $('#sharethis').attr('st_url'); 
     var titSha = $('#sharethis').attr('st_title'); 
     stWidget.addEntry({ 
      "service":"facebook", 
      "element":document.getElementById('facebook'), 
      "url":urlFace, 
      "title":titFace, 
      "type":"hcount", 
      "text":titFace , 
      "image":"http://www.softicons.com/download/internet-icons/social-superheros-icons-by-iconshock/png/256/sharethis_hulk.png", 
      "summary":"this is description1" 
    }); 
    stWidget.addEntry({ 
      "service":"twitter", 
      "element":document.getElementById('twitter'), 
      "url":urlTwi, 
      "title":titTwi, 
      "type":"hcount", 
      "text":titTwi , 
      "image":"http://www.softicons.com/download/internet-icons/social-superheros-icons-by-iconshock/png/256/sharethis_hulk.png", 
      "summary":"this is description1" 
    }); 
     stWidget.addEntry({ 
      "service":"sharethis", 
      "element":document.getElementById('sharethis'), 
      "url":urlSha, 
      "title":'compartir', 
      "type":"hcount", 
      "text":titSha , 
      "image":"http://www.softicons.com/download/internet-icons/social-superheros-icons-by-iconshock/png/256/sharethis_hulk.png", 
      "summary":"this is description1" 
    }); 
     return false; 

     }); 

     $('#cerrar').live('click', function(){ 
      $('.lb-cont').fadeOut('normal'); 
     shareB.fadeOut('normal', function(){ 
     $('.sb-cont .'+defaults.nameHideCont).remove(); 
     }); 

    }); 


     function pos_obj(){ 
       lbw = shareB.width(); 
       var arrPageSizes = ___getPageSize(); 
       $('.lb-cont').css({ 
         width:  arrPageSizes[0], 
         height:  arrPageSizes[1] 
        }); 
      // Get page scroll 
      var arrPageScroll = ___getPageScroll(); 
      shareB.css({ 
         top: arrPageScroll[1] + (arrPageSizes[3]/10), 
         left: (arrPageSizes[0]/2)-(lbw/2)+'px' 
         }); 

      } 

     $(window).resize(function(){ 
       shareB = $('.sb-cont'); 
       var arrPageSizes = ___getPageSize(); 
       var arrPageScroll = ___getPageScroll(); 

       pos_obj(); 
     }); 

     /** 
    /THIRD FUNCTION 
    * getPageSize() by quirksmode.com 
    * 
    * @return Array Return an array with page width, height and window width, height 
    */ 
    function ___getPageSize() { 
     var xScroll, yScroll; 
     if (window.innerHeight && window.scrollMaxY) { 
      xScroll = window.innerWidth + window.scrollMaxX; 
      yScroll = window.innerHeight + window.scrollMaxY; 
     } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac 
      xScroll = document.body.scrollWidth; 
      yScroll = document.body.scrollHeight; 
     } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari 
      xScroll = document.body.offsetWidth; 
      yScroll = document.body.offsetHeight; 
     } 
     var windowWidth, windowHeight; 
     if (self.innerHeight) { // all except Explorer 
      if(document.documentElement.clientWidth){ 
       windowWidth = document.documentElement.clientWidth; 
      } else { 
       windowWidth = self.innerWidth; 
      } 
      windowHeight = self.innerHeight; 
     } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode 
      windowWidth = document.documentElement.clientWidth; 
      windowHeight = document.documentElement.clientHeight; 
     } else if (document.body) { // other Explorers 
      windowWidth = document.body.clientWidth; 
      windowHeight = document.body.clientHeight; 
     } 
     // for small pages with total height less then height of the viewport 
     if(yScroll < windowHeight){ 
      pageHeight = windowHeight; 
     } else { 
      pageHeight = yScroll; 
     } 
     // for small pages with total width less then width of the viewport 
     if(xScroll < windowWidth){ 
      pageWidth = xScroll;   
     } else { 
      pageWidth = windowWidth; 
     } 
     arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight); 
     return arrayPageSize; 
    }; 
    /** 
    /THIRD FUNCTION 
    * getPageScroll() by quirksmode.com 
    * 
    * @return Array Return an array with x,y page scroll values. 
    */ 
    function ___getPageScroll() { 
     var xScroll, yScroll; 
     if (self.pageYOffset) { 
      yScroll = self.pageYOffset; 
      xScroll = self.pageXOffset; 
     } else if (document.documentElement && document.documentElement.scrollTop) {  // Explorer 6 Strict 
      yScroll = document.documentElement.scrollTop; 
      xScroll = document.documentElement.scrollLeft; 
     } else if (document.body) {// all other Explorers 
      yScroll = document.body.scrollTop; 
      xScroll = document.body.scrollLeft; 
     } 
     arrayPageScroll = new Array(xScroll,yScroll); 
     return arrayPageScroll; 
    }; 

    }); 


    } 
})(jQuery); 

我呼吁我的插件是这样的:

jQuery('.catalogo').shareBox({ 
     nameHideCont:'light-cont', 
     hiddenElement:true 
     }); 

jQuery('.images').shareBox({ 
     nameHideCont:'light-cont2', 
     }); 

回答

0

只动prepend部分出shareBox功能。这样,只有当你的插件注册时,它才会变成一次。

(function($){ 

$('body').prepend('<div class="lb-cont"></div><div class="sb-cont"></div>'); 

$.fn.shareBox = function(options){ 

    var defaults = { 
     fadeSpeed : 500, 
     hiddenElement: false, 
     nameHideCont : ''//nombre del contenedor con clase hide 
     }, 
     settings = $.extend(defaults, options); 

    var shareB = $('.sb-cont'); 


    shareB.css('display','none'); 


    this.each(function(){ 

    var obj = $(this); 
    var verMas = $('a', obj) 

    var lbw = shareB.width(); 



    obj.bind('click', function(){ 



     if(defaults.hiddenElement){ 
     var contenido = $('.'+defaults.nameHideCont, obj).clone(true, true).removeClass('hide'); 
     contenido.appendTo(shareB); 

     } 

     $('.lb-cont').fadeIn(defaults.fadeSpeed); 
     shareB.fadeIn(defaults.fadeSpeed); 
     shareB = $('.sb-cont'); 

     pos_obj(); 


     var cerrar = '<div id="cerrar-cont"><div id="cerrar">X</div></div>'; 
    $(cerrar).prependTo('.'+defaults.nameHideCont); 
     $('.imagess').epicZoom({}); 
     var urlFace = $('#facebook').attr('st_url'); 
     var titFace = $('#facebook').attr('st_title'); 
     var urlTwi = $('#twitter').attr('st_url'); 
     var titTwi = $('#twitter').attr('st_title'); 
     var urlSha = $('#sharethis').attr('st_url'); 
     var titSha = $('#sharethis').attr('st_title'); 
     stWidget.addEntry({ 
      "service":"facebook", 
      "element":document.getElementById('facebook'), 
      "url":urlFace, 
      "title":titFace, 
      "type":"hcount", 
      "text":titFace , 
      "image":"http://www.softicons.com/download/internet-icons/social-superheros-icons-by-iconshock/png/256/sharethis_hulk.png", 
      "summary":"this is description1" 
    }); 
    stWidget.addEntry({ 
      "service":"twitter", 
      "element":document.getElementById('twitter'), 
      "url":urlTwi, 
      "title":titTwi, 
      "type":"hcount", 
      "text":titTwi , 
      "image":"http://www.softicons.com/download/internet-icons/social-superheros-icons-by-iconshock/png/256/sharethis_hulk.png", 
      "summary":"this is description1" 
    }); 
     stWidget.addEntry({ 
      "service":"sharethis", 
      "element":document.getElementById('sharethis'), 
      "url":urlSha, 
      "title":'compartir', 
      "type":"hcount", 
      "text":titSha , 
      "image":"http://www.softicons.com/download/internet-icons/social-superheros-icons-by-iconshock/png/256/sharethis_hulk.png", 
      "summary":"this is description1" 
    }); 
     return false; 

     }); 

     $('#cerrar').live('click', function(){ 
      $('.lb-cont').fadeOut('normal'); 
     shareB.fadeOut('normal', function(){ 
     $('.sb-cont .'+defaults.nameHideCont).remove(); 
     }); 

    }); 


     function pos_obj(){ 
       lbw = shareB.width(); 
       var arrPageSizes = ___getPageSize(); 
       $('.lb-cont').css({ 
         width:  arrPageSizes[0], 
         height:  arrPageSizes[1] 
        }); 
      // Get page scroll 
      var arrPageScroll = ___getPageScroll(); 
      shareB.css({ 
         top: arrPageScroll[1] + (arrPageSizes[3]/10), 
         left: (arrPageSizes[0]/2)-(lbw/2)+'px' 
         }); 

      } 

     $(window).resize(function(){ 
       shareB = $('.sb-cont'); 
       var arrPageSizes = ___getPageSize(); 
       var arrPageScroll = ___getPageScroll(); 

       pos_obj(); 
     }); 

     /** 
    /THIRD FUNCTION 
    * getPageSize() by quirksmode.com 
    * 
    * @return Array Return an array with page width, height and window width, height 
    */ 
    function ___getPageSize() { 
     var xScroll, yScroll; 
     if (window.innerHeight && window.scrollMaxY) { 
      xScroll = window.innerWidth + window.scrollMaxX; 
      yScroll = window.innerHeight + window.scrollMaxY; 
     } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac 
      xScroll = document.body.scrollWidth; 
      yScroll = document.body.scrollHeight; 
     } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari 
      xScroll = document.body.offsetWidth; 
      yScroll = document.body.offsetHeight; 
     } 
     var windowWidth, windowHeight; 
     if (self.innerHeight) { // all except Explorer 
      if(document.documentElement.clientWidth){ 
       windowWidth = document.documentElement.clientWidth; 
      } else { 
       windowWidth = self.innerWidth; 
      } 
      windowHeight = self.innerHeight; 
     } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode 
      windowWidth = document.documentElement.clientWidth; 
      windowHeight = document.documentElement.clientHeight; 
     } else if (document.body) { // other Explorers 
      windowWidth = document.body.clientWidth; 
      windowHeight = document.body.clientHeight; 
     } 
     // for small pages with total height less then height of the viewport 
     if(yScroll < windowHeight){ 
      pageHeight = windowHeight; 
     } else { 
      pageHeight = yScroll; 
     } 
     // for small pages with total width less then width of the viewport 
     if(xScroll < windowWidth){ 
      pageWidth = xScroll;   
     } else { 
      pageWidth = windowWidth; 
     } 
     arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight); 
     return arrayPageSize; 
    }; 
    /** 
    /THIRD FUNCTION 
    * getPageScroll() by quirksmode.com 
    * 
    * @return Array Return an array with x,y page scroll values. 
    */ 
    function ___getPageScroll() { 
     var xScroll, yScroll; 
     if (self.pageYOffset) { 
      yScroll = self.pageYOffset; 
      xScroll = self.pageXOffset; 
     } else if (document.documentElement && document.documentElement.scrollTop) {  // Explorer 6 Strict 
      yScroll = document.documentElement.scrollTop; 
      xScroll = document.documentElement.scrollLeft; 
     } else if (document.body) {// all other Explorers 
      yScroll = document.body.scrollTop; 
      xScroll = document.body.scrollLeft; 
     } 
     arrayPageScroll = new Array(xScroll,yScroll); 
     return arrayPageScroll; 
    }; 

    }); 


    } 
})(jQuery) 
+0

嗨Emre,感谢您的回答,但它不工作 – Mauro