Soru Bootstrap Popover - metin popover içindeki bağlantıyı nasıl eklersiniz?


Ben bootstrap 3 popover kullanıyorum.

Ve şimdi metin popvover üzerinde bağlantı istiyorum.

Kod:

<a href="#" 
  role="button" 
  class="btn popovers" 
  data-toggle="popover" 
  title="" 
  data-content="test content <a href="" title="test add link">link on content</a>" 
  data-original-title="test title"
  >
  test link
</a>

Ama html kodunu başladığımda:

<a href="#" role="button" class="btn popovers" data-toggle="popover" title="" data-content="test content &lt;a href=" "="">link on content</a>
" 
data-original-title="test title"
&gt;
test link

Bu problemi sembolde biliyorum " ama bilmiyorum bağlantıda link ekle ...

Söyle bana nasıl düzgün kod olacak?

P.S .: Eğer soru zaten varsa lütfen bana bağlantı verin. 


46
2017-11-30 10:42


Menşei




Cevaplar:


Geçmen gerekecek html değerle seçenek true aşağıdaki gibi popover başlatırken.

gösteri

JS:

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

HTML:

<a href="#" role="button" class="btn popovers" data-toggle="popover" title="" data-content="test content <a href='' title='test add link'>link on content</a>" data-original-title="test title">test link</a>

76
2017-11-30 11:40



Bu çalışır, ancak "Sonraki tıklamayı reddet" (= attribute data-trigger = "focus") ile birlikte çalışmaz. - Wouter
Veri içeriğinde tek tırnak (') önemli midir? - NaveenDA
Evet, sanırım. - nik
Aşağıdaki "Sonraki tıklamayı reddet" durumu için geçici çözüm sağladım. - Daniil Grankin


Sadece özniteliği kullan veri-html = "true".

<button
  data-toggle="popover"
  data-content="Link: <a href='xyz.com'>XYZ</a>"
  data-html="true">
  CLICK
</button>

34
2017-12-28 23:01



href bölümünde <a href = "#" role = "button" a nasıl link eklenir - Sanshayan


<a href="#" class="btn popovers" data-toggle="popover" title="" data-content="test content <a href='' title='test add link'>link on content</a>" data-html="true"><i class="glyphicon glyphicon-info-sign"></i></a>

Sadece data-html = "true" ekleyerek link niteliği ile çalışmaktadır :)


1
2018-05-04 07:16





Verilen cevaplar doğru olsa da, bir bağlantı sorunlara neden olacaktır. data-trigger="focus" uygulanır. Öğrendiğim gibi bir müşteriden tıklama bir popover üzerinde hızlı bir şekilde gerçekleşirse, bağlantı harekete geçecektir, bir kullanıcı mousebuttonunu basılı tutarsa, maalesef tetikleyici devreye girer ve popover gerçekleşir. Kısacası, bir bağlantının gerekli olup olmadığını ve kısa süreli tıklamalar için plan yapmayı düşünün.


1
2018-03-01 14:24





kullandım data-trigger="focus" ve popover içeriğinde bir bağlantı ile bir sorun vardı. Bağlantıda fare düğmesine tıklanır ve bir süre basılı tutulursa, popover kaybolur ve bağlantı 'çalışmaz' olur. Bazı müşteriler bunun hakkında şikayet etti. Sorunu yeniden üretebilirsin İşte.

Ben folowing kullandım kod sorunu çözmek için:

data-trigger="manual" html ve

$("[data-toggle=popover]")
.popover({ html: true})
    .on("focus", function () {
        $(this).popover("show");
    }).on("focusout", function () {
        var _this = this;
        if (!$(".popover:hover").length) {
            $(this).popover("hide");
        }
        else {
            $('.popover').mouseleave(function() {
                $(_this).popover("hide");
                $(this).off('mouseleave');
            });
        }
    });

1
2018-03-26 21:31