2

理由はわかりませんが、tooltipster の html コンテンツが表示されません。HTML をエンコードし、スクリプトにオプションを追加しましたが、文字列のままです。

$(document).ready(function() {
  $('.tooltip').tooltipster({
    contentAsHTML: true,
    interactive: true,
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://iamceege.github.io/tooltipster/js/jquery.tooltipster.js"></script>
<link rel="stylesheet" href="http://iamceege.github.io/tooltipster/css/tooltipster.css">
<span title="&amp;lt;img src=&amp;quot;my-image.png&amp;quot; /&amp;gt; &amp;lt;strong&amp;gt; This text is in bold case !&amp;lt;/strong&amp;gt;" class="tooltip">Why is this not working</span>

4

1 に答える 1

6

&amp;あなたのタイトル属性には、本来あるべき場所のインスタンスがたくさんあります&

たとえば、次のようなものがあります。

&amp;lt;img src=&amp;quot;my-image.png&amp;quot; /&amp;gt;

それがいつあるべきか:

&lt;img src=&quot;my-image.png&quot; /&gt;

title 属性をどのように生成したかわかりません。文字列を 2 回エスケープした可能性があります。


作業スニペット:

$(document).ready(function() {
  $('.tooltip').tooltipster({
    contentAsHTML: true,
    interactive: true,
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://iamceege.github.io/tooltipster/js/jquery.tooltipster.js"></script>
<link rel="stylesheet" href="http://iamceege.github.io/tooltipster/css/tooltipster.css">
<span class="tooltip" title="&lt;img src=&quot;my-image.png&quot; /&gt; &lt;strong&gt; This text is in bold case !&lt;/strong&gt;">This is working</span>

于 2015-06-26T22:24:45.733 に答える