jQuery Girl
  1. jQuery Girl
  3. reliant des éléments de dom dynamics au plugin content.js
Intereting Posts
Comment afficher la réponse ajax dans la grid des produits? JQuery File Upload envoie chaque fichier sous forme de demande individuelle? comment attacher des gestionnaires d’événements jquery pour le HTML nouvellement injecté? Arrêter jQuery de faire sa chose? accordéon, menus à tabs, atsortingbution de la classe de sélection pour les deux Comment inclure un jsp dans un autre jsp en utilisant javascript Tout le contenu ne s’affiche pas à l’intérieur du popup Puis-je éviter de placer des appels $ (document) .ready () dans chaque fichier JavaScript? Jquery choisi, récupération de plusieurs valeurs de sélection dans vbscript / classic asp et ASPupload Comment exécuter une fonction de rappel une fois le contenu ajax chargé dans un onglet jquery ui récemment ajouté Le bouton radio change la couleur d’arrière-plan de la ligne du tableau lorsqu’il est sélectionné et revient à la normale lorsque vous sélectionnez un autre bouton radio sans “survoler” Graphique à barres Chartjs montrant les anciennes données en vol stationnaire jQGrid – Change la couleur de fond de l’en-tête de regroupement Si la largeur du conteneur, le remplissage et la hauteur de ligne sont connus, comment calculer la hauteur? jQuery autocomplete doit ignorer l’élément désactivé lors de l’utilisation du clavier

reliant des éléments de dom dynamics au plugin content.js

J’ai un plugin qui im ​​utilisant content.js appelé http://innovastudio.com/content-builder.aspx

J’ajoute des divs dynamics à la page pour laquelle je souhaite que le plugin content.js lui soit atsortingbué, afin de pouvoir utiliser ses fonctionnalités.

Sur un seul div ou div déjà défini dans la page, je ne semble pas avoir de problèmes avec plusieurs divs.

Cependant, si j’ajoute une div de même classe, je ne peux pas sembler y lier le plugin.

J’ai inclus le code permettant d’instancier la div avec le plugin contentbuilder, mais je me demandais s’il était possible de le lier à de nouveaux éléments ajoutés à la page avec la classe “lettre”. Ou s’il existe un moyen générique de lier les plugins aux divs en utilisant jquery. 

$('div.letter').contentbuilder({ enableZoom:false, snippetOpen: true, imageselect: 'images.html', fileselect: 'images.html', snippetFile: '/assets/templates/content-builder/default/snippets.html', toolbar: 'left', //sourceEditor: false, onDrop:function(){ // function for when an item is dragged into the editable area }, onRender: function () { var coverLength = $("#coverpage div.row").length; var mainContent = $("#maincontent div.row").length; if(coverLength == 0) { $("#coverpage").html('
Select your content from the right sidebar
') } else { $("#coverpage div.no-content-on-page").remove(); } if(mainContent == 0) { $("#maincontent").html('
Select your content from the right sidebar
') } else { $("#maincontent div.no-content-on-page").remove(); } //custom script here } });

Si vous devez append ces divs de manière dynamic, je pense que vous devriez lancer le plugin à chaque fois que vous ajoutez un nouveau div. Pour éviter deux fois le même div, utilisez une classe comme dans l’exemple suivant: 

 function createLetter(){ $("body").append('
'); initContentBuilder(); } function initContentBuilder(){ $('div.letter.mustBeActivated').contentbuilder({ enableZoom:false, snippetOpen: true, imageselect: 'images.html', fileselect: 'images.html', snippetFile: '/assets/templates/content-builder/default/snippets.html', toolbar: 'left', //sourceEditor: false, onDrop:function(){ // function for when an item is dragged into the editable area }, onRender: function () { var coverLength = $("#coverpage div.row").length; var mainContent = $("#maincontent div.row").length; if(coverLength == 0) { $("#coverpage").html('
Select your content from the right sidebar
') } else { $("#coverpage div.no-content-on-page").remove(); } if(mainContent == 0) { $("#maincontent").html('
Select your content from the right sidebar
') } else { $("#maincontent div.no-content-on-page").remove(); } //custom script here } }).removeClass('mustBeActivated'); }