Question

我已经尽力搜索了这一点，并找到了看似正确的答案。但它对我不起作用。我在div里面有这个CKEditor。在这个CKEditor中，有很多内容，我想在这个编辑器中的所有H1样式上添加一个悬停事件。

div结构如下所示：

<div id="content" class="cke_editable">
   <h1>
      <span>My content</span>
    </h1>
</div>

我正在尝试使用qTip2，因为它似乎符合我的需要。但我无法选择H1标签。是因为它在一个既有ID又有类的div中？或者它与H1内部有<span>标签的事实有什么关系？

这是javascript：

<script type="text/javascript">
var shared = {
    position: {
        my: 'top left', 
        at: 'bottom right',
    },
    style: {
        tip: true
    }
};

$('h1').qtip( $.extend({}, shared, { 
    content: 'An example tooltip',
    style: {
        classes: 'ui-tooltip-red'
    }
}));
</script>

说到选择器，我尝试过只选择H1，就像这个例子一样。以及$('.cke_editable h1')，$('#content h1')和$('#content > h1')。但没有骰子。在我的CSS中，我已成功将cursor: pointer添加到#content h1。这很有效。

我在这里做错了吗？

编辑：如果我直接选择$('#content').qtip，它可以正常工作。

Answer 1

试着这样说：

$('h1','#content').qtip

或：

$('#content').find('h1').qtip

Answer 2

CKEditor在它放置内容时创建一个iframe，因此你不能使用jQuery选择器来选择其中的元素，因为它甚至不再在同一个文档中。

Javascript - 在DIV中选择H1

2 个答案: