Popover

CreativPur

Erfahrenes Mitglied
Hi,

ich habe mal wieder ein kleines Problem..

Ich habe in Bootstrap ein Popover, welches auch tatsächlich funktioniert. Die Möglichkeit, html dort einzubinden ist gegeben.Siehe Script.
Nun möchte ich im data-content außer dem Text einen link einfügen.
Dieser verhält sich zwar optisch wie ein Link, dennoch wird auf die angegebene Seite nicht weitergeleitet.
Wo liegt da nur der Wurm begraben ?

HTML-Text

Code:
<h3>
Übernommene Daten Ihrer Anmeldung
<a tabindex="0" class="btn btn-xs btn-danger" data-toggle="popover" data-trigger="focus"
title="Übernommene Daten Ihrer Anmeldung."

data-content="<p>Diese Daten werden automatisch über Ihren Account übernommen und können nicht verändert werden.</p><hr /><p>Änderungen dieser Daten sind nur über das <a href='http://www.yahoo.de' target='_blank'><br /><span1>Daten-Änderungs-Formular</span><br /></a> möglich.</p>">

 ?
</a>
 </h3>

Script
Code:
<script>
$(document).ready(function(){
    $('.btn').popover({html: true, placement: "right"});
});

</script>
 
Du hast dich an das falsche Forum gewendet, denn du verwendest JavaScript, und nicht Java!

Zu deiner Frage: Ohne das Attribut data-trigger="focus" ist der "eingebettete" Link ausführbar, das Popover dann nur per Voreinstellung schließbar.
w3schools.com | Bootstrap Popover hat gesagt.:
Closing Popovers
By default, the popover is closed when you click on the element again. However, you can use the data-trigger="focus" attribute which will close the popover when clicking outside the element
Zitat-Quelle: http://www.w3schools.com/bootstrap/bootstrap_popover.asp

"... will close the popover when clicking outside the element" beinhaltet auch die Fläche der Popover-Box.
 
Zuletzt bearbeitet:
Vielen Dank für Deine schnelle Antwort..
Das mit dem Focus habe ich auch schon gemerkt. Allerdings habe ich in dem Popover einen Link, welcher ein Modal-Fenster öffnen soll. Leider liegt das Popober-Fenster dann immer auf dem Modalfenster.
Daher die Überlegung, das Popover Fenster durch betätigen des Links per onclick zu schließen, aber dafür reichen meine Kenntnisse leider nicht aus
 
Jetzt habe ich es doch mit data-trigger="focus" gelöst..

das Script muss nur eine kleine Ergänzung bekommen..
Code:
<script>
$(document).ready(function(){
    $('.btn').popover({html: true, placement: "right", delay: {show: 0, hide: 1000}});
});

</script>
 
Das mit dem Focus habe ich auch schon gemerkt. Allerdings habe ich in dem Popover einen Link, welcher ein Modal-Fenster öffnen soll. Leider liegt das Popober-Fenster dann immer auf dem Modalfenster.
Daher die Überlegung, das Popover Fenster durch betätigen des Links per onclick zu schließen, aber dafür reichen meine Kenntnisse leider nicht aus
Dass es sich dabei um einen Link zu einem Modal-Window handelt, und dieses von dem Popover überlagert wird, ging aus deiner ersten (!) Problembeschreibung aber überhaupt nicht hervor!

Stattdessen hast du im Quellcode einen "Dummy"-Link zu yahoo.de präsentiert, und geschildert, dass das Verweisziel nicht aufgerufen wird! :rolleyes:

Soviel zu deiner einleitenden kompetenten Fehlerbeschreibung:
ich habe mal wieder ein kleines Problem..

Ich habe in Bootstrap ein Popover, welches auch tatsächlich funktioniert. Die Möglichkeit, html dort einzubinden ist gegeben.Siehe Script.
Nun möchte ich im data-content außer dem Text einen link einfügen.
Dieser verhält sich zwar optisch wie ein Link, dennoch wird auf die angegebene Seite nicht weitergeleitet.
Wo liegt da nur der Wurm begraben ?

HTML-Text

Code:
<h3>
Übernommene Daten Ihrer Anmeldung
<a tabindex="0" class="btn btn-xs btn-danger" data-toggle="popover" data-trigger="focus"
title="Übernommene Daten Ihrer Anmeldung."

data-content="<p>Diese Daten werden automatisch über Ihren Account übernommen und können nicht verändert werden.</p><hr /><p>Änderungen dieser Daten sind nur über das <a href='http://www.yahoo.de' target='_blank'><br /><span1>Daten-Änderungs-Formular</span><br /></a> möglich.</p>">

?
</a>
</h3>

Script
Code:
<script>
$(document).ready(function(){
    $('.btn').popover({html: true, placement: "right"});
});

</script>

EDIT
Jetzt habe ich es doch mit data-trigger="focus" gelöst..

das Script muss nur eine kleine Ergänzung bekommen..
Code:
<script>
$(document).ready(function(){
    $('.btn').popover({html: true, placement: "right", delay: {show: 0, hide: 1000}});
});

</script>
Na denn... das Thema bitte als erledigt markieren.
 
Zuletzt bearbeitet:

Neue Beiträge

Zurück