Question

我有一个正常工作的popover代码。但是当popover在div中时，它就会停止工作。

    <section class="content-section">
      <h2>What Are They?</h2>

      //this popover is working
      <p>Also known as <span class="glossary-term-pop" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="(aka Research community) pronounced 'M-Rock'. One of the terms used for a research community." title="" data-original-title="MROC (Market Research Online Community)">MROCs</span>    (Market Research Online Community) the commun only, Webs.</p>
    </section>
    <hr />
    <section class="content-section">
      <h2>Pros and Cons</h2>
      <section class="tabs" style=' margin-top:15em;'>
        <input id="tab-1" type="radio" name="radio-set" class="tab-selector-1" checked="checked" />
        <label for="tab-1" class="tab-label-1">Pros</label>
        <input id="tab-2" type="radio" name="radio-set" class="tab-selector-2" />
        <label for="tab-2" class="tab-label-2">Cons</label>
        <div class="content less-stuff">
          <div class="content-1">
            <h3>Pros</h3>

            //this popover is NOT working
            <p>Communities are usually larger than any set of <span class="glossary-term-pop" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="(aka Focus Group Interview or Group D with fewer participants - possibly 4-6."  title="" data-original-title="Focus Group">focus groups</span>. This can allow minority opin-minded participants to take place - rich data that would never emerge in a focus group setting.</p>
          </div>
          <div class="content-2">
            <h3>Cons</h3>
            <p>Qualitative-nflection is lost.</p>
          </div>
        </div>
      </section>
    </section>

这是JSFIDDLE：https://jsfiddle.net/erkaner/46awL808/2/

你会看到两个带蓝色背景的单词，第一个显示弹出窗口，但第二个不显示。

有没有人知道如何解决这个问题？

Answer 1

你的css选择器的副作用。

Updated fiddle

只需在标记上使用正确的选择器，我只需将section.tabs .content div替换为section.tabs .content > div，然后就可以了。

包含在div中时，popover不起作用

1 个答案: