javascript - TypeError: $(...).lightGallery(...).destroy is not a function - Stack Overflow

admin管理员组

文章数量:1289528

I am getting this error from firefox:

TypeError: $(...).lightGallery(...).destroy is not a function

I am using following plugin for play video and show image gallery .

I want re-initialize lightGallery because I am using ajax to add element dynamically in container. It was working fine with previous version of lightGallery but it is not working with current version.

I am using following code.

// destroy previous gallery
$("#lightGallery2").lightGallery({
  selector : '.image_gallery',
  videojs: true,
  download: false
}).destroy();

// re-initialize
$("#lightGallery2").lightGallery({
  selector: '.image_gallery',
  videojs: true,
  download: false
});

Please suggest.

Thanks

I am getting this error from firefox:

TypeError: $(...).lightGallery(...).destroy is not a function

I am using following plugin for play video and show image gallery https://github./sachinchoolur/lightGallery.

I want re-initialize lightGallery because I am using ajax to add element dynamically in container. It was working fine with previous version of lightGallery but it is not working with current version.

I am using following code.

// destroy previous gallery
$("#lightGallery2").lightGallery({
  selector : '.image_gallery',
  videojs: true,
  download: false
}).destroy();

// re-initialize
$("#lightGallery2").lightGallery({
  selector: '.image_gallery',
  videojs: true,
  download: false
});

Please suggest.

Thanks

• javascript
• jquery
• lightgallery
• lightgallery-1

Share Improve this question Follow edited Jul 31, 2021 at 22:49 jasie 2,4441212 gold badges4646 silver badges5959 bronze badges asked Sep 18, 2015 at 11:11 Pramod KumarPramod Kumar 7611 silver badge55 bronze badges 1

• Log a bug if you think it is one: github./sachinchoolur/lightGallery/issues – epascarello Commented Sep 18, 2015 at 11:21

Add a ment  | 

6 Answers 6

Sorted by: Reset to default 9

The following code works for me:

$lg.on('onBeforeClose.lg',function(event, index, fromTouch, fromThumb){
    try{$lg.data('lightGallery').destroy(true);}catch(ex){};
});

For destroy data you should add data attribute to your gallery then destroy it, for example if you apply gallery to all links:

var myGallery = 'body',
    lightgallery = function() {
         $( myGallery ).attr('data-lightGallery', '1');
         $( myGallery ).lightGallery({selector: 'a[href$=".jpg"], a[href$=".jpeg"], a[href$=".png"], a[href$=".gif"]'});
    };

Then:

$( myGallery ).data('lightGallery').destroy(true);
lightgallery();

If it is written like most plugins/widgets, you should be calling the destroy method like this.

$("#lightGallery2").lightGallery("destroy");

You have to use the following method to destroy lightgallery version 1.2.x.

var $lg = $('#lightGallery2');

$lg.lightGallery({
  selector : '.image_gallery',
  videojs: true,
  download: false
});

$lg.data('lightGallery').destroy(true);

Here is the docs

I simply created a global variable. It allows me to perform the desired function.

var PLUGIN; // global variable
...
if(PLUGIN) PLUGIN.data('lightGallery').destroy(true); // destroy 
PLUGIN = $("#lightGallery2").lightGallery();

In case if you want to re-initialize lightGallery right after destroying it, initialize it only once the destroy process is pleted. You can use refresh method most of the times.

const plugin = lightGallery();
// Delete or add children, then call
plugin.refresh();

本文标签： javascriptTypeError ()lightGallery()destroy is not a functionStack Overflow