Obtenir les éléments de balises HTML à l'intérieur des données de contenu de liste

Je suis en train de travailler dans la "liste" de Bootstrap3. Ici, j'ai placé le contenu HTML comme ci-dessous,

<a href='#' class='btn' title ='Test' data-trigger='focus' data-
toggle='popover' data-html='true' id = 'testOutside' data-content='<a 
href="#" id="testInside" class="btn">Inside</a>'>Click Here </a>

Je ne suis pas en mesure de se référer à l'élément html présents au sein de l'-le contenu de l'attribut.

Comme ci-dessous,

$(document).ready(function(){
$('[data-toggle="popover"]').popover();

//the below is not working
$('#testInside').click(function(){
alert('Inside');
});

$('#testOutside').click(function(){
alert('Outside');
});
});

Mais le bootstrap classes sont de mieux appliquée, Dans ce cas "btn" s'applique à la balise d'ancrage. Fixation de la jsFiddle. Quelqu'un peut-il m'expliquer cela?

Votre question est vague.

OriginalL'auteur novice_developer | 2015-07-19

  1. 5

    En fait, il est possible de le faire facilement à l'aide de la shown.bs.popover déclencheur. Il sera exécuté après la liste est affichée. Il est alors possible de add new listeners ou à l'actualisation de celles déjà existantes.

    Javascript

    $('[data-toggle="popover"]').popover(
    {html:true}
);

$('[data-toggle="popover"]').on('shown.bs.popover', function () {
    $('#testInside').click(function(){
        alert('Inside');
    });

    $('#testOutside').click(function(){
        alert('Outside');
    });
})

    HTML

    <a href='#' class='btn' title ='Test' data-trigger='focus' data-
toggle='popover' data-html='true' id = 'testOutside' data-content='<a
href="#" id="testInside" class="btn">Inside</a>'>Click Here </a>

    OriginalL'auteur Online-Free-Tools.com

  2. 1

    Lorsque votre document est prêt, il n'y a aucun élément dans le DOM qui a un id de testInside. Cet élément est créé lorsque vous cliquez sur le #testOutside. Pour cette raison, tout gestionnaire d'événements que vous créez à $(document).ready(...) est inutile.

    Donc la bonne façon de le faire est d'enregistrer un rappel immédiatement après #testInside est ajouté au DOM. Et nous savons ce qui arrive quand les #testOuside est cliqué.

    //adding delay over here due to popover close event may trigger before link click event (which happens in Firefox)
$('you-selector').popover({
    delay: 100
});

$('#testOutside').click(function(){
    $('#testInside').click(function(){
        alert('Inside');
    });

    alert('Outside');
});
    Malheureusement, ce n'est pas vrai, même si cela semble évident. La chaîne à l'intérieur de la data-content attribut est juste une chaîne et il est ajouté avec $.text() méthode. Mais ce n'est pas tout, d'événement si vous avez la force de la popup à utiliser $.html() il ne sera toujours pas de travail.
    Je suis désolé, mais je suis en désaccord avec ce que vous dites. Voici un JsFiddle démontrant ma réponse: jsfiddle.net/parthsha/8zs660na/1
    Copiez votre violon lien, ouvrez une nouvelle fenêtre de votre navigateur et vous verrez que dans google chrome, il ne fonctionne qu'après avoir cliqué sur le déclencheur une deuxième fois et dans firefox, ça ne fonctionne pas du tout.
    vous êtes correct. Et j'ai appris une nouvelle chose aujourd'hui. Merci monsieur!
    Pas de problème, bon codage. 😉

    OriginalL'auteur Parth Shah

  3. 0

    J'ai fait un très difficile problème simplement possible à l'aide de montré.bs.liste même de la chose est que j'ai une notation de la composante sur la pophover , mais le problème est que la notation ne pas obtenir le hover événement becuse de cette méthode doivent être appelés sur la cote d'entrée est créée.

    $(".rating_product").rating('refresh', 
 {showClear: false,hoverEnabled:true,hoverChangeStars:true,showCaption: true,starCaptions: {5.0:'5 Stars'}
 });

    Alors j'ai mis ça et ça a fonctionné que l'insertion de la fonction.

    $('[data-toggle="popover"]').on('shown.bs.popover', function () {


          $(".rating_product").rating('refresh', 
            {showClear: false,hoverEnabled:true, hoverChangeStars:true,showCaption: true,starCaptions: {5.0:'5 Stars'}
          });

})

    OriginalL'auteur danielad