Question

我正在使用chrome控制台并尝试在那里添加一些jQuery，以便在WordPress TinyMCE编辑器中操作对象的运行时样式。

我在编辑器中有一个div元素，类为“my_box”，我试图通过jQuery操作运行时样式，如下所示：

jQuery('#tinymce .my_box').hover(
    function(){
        jQuery(this).attr('style','border:3px dashed red')
    }
);

但是，当我在控制台中运行它时，DOM结果集为空[]。如何将事件附加到tinymce编辑器中的对象，以及在我测试它之后我应该将脚本放在哪里？

Answer 1

当它运行时，它将在包装器中找到当时存在.my_box的任何实例。如果他们当时不在那里，或者#tinymce不是真正的包装器，但是生成了一些东西，那么下面的选择器将什么也找不到。

jQuery('#tinymce .my_box').hover(
    function(){
        jQuery(this).attr('style','border:3px dashed red')
    }
);

考虑这样的事情，其中#tinymceWrap是包装编辑器的独立div：

jQuery('#tinymceWrap').hover(
    function(){
        // use find here so jquery will search for `.my_box` instances again on each hover
        jQuery(this).find('.my_box').css('border','3px dashed red');
    }
);

运行jQuery反对tinymce

1 个答案: