jQuery技术:TinyMCE编辑器中的目标元素

在TinyMCE 4编辑器中定位元素(比如给定类的所有图像)的最佳方法是什么。 我发现了一些较旧的解决方案( 即将hover事件添加到tinymce编辑器中的元素 ),然而,它们适用于TinyMCE 3.请注意,元素可以在初始渲染后添加到编辑器中,因此需要类似jQuery的on()function。

一种选择可能是做一些像$('#tinymce_id').contents()...

或者也许在配置TinyMCE时, tinymce.init({'selector': '#tinymce_id','setup' : function(ed) {do something here?}});

    我找到的最佳方式。

     tinymce.init({ 'selector': "#tinymce_id", 'setup' : function(ed) { ed.on('init', function(e) { $(ed.getBody()).on("click", "img", function() {alert('hello');}); }); } }); 

    使用此逻辑:

     //on click event $("#test").click(function(){ //get the text of the tinymce editor and convert it to an html element html = $.parseHTML(tinymce.activeEditor.getContent()); //do anything with the content here $(html).find("img.editor-img").css("width", "100px"); //convert it back to text text = $(html).html(); //add it to the tinymce tinymce.activeEditor.setContent(text); }); 

    示例: http : //jsfiddle.net/rqwVA/1/

    需要了解更多jQuery教程分享TinyMCE编辑器中的目标元素,都可以关注jQuery技术分享栏目—计算机技术网(www.ctvol.com)!

      以上就是jQuery教程分享TinyMCE编辑器中的目标元素相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。

      本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

      ctvol管理联系方式QQ:251552304

      本文章地址:https://www.ctvol.com/jquerytutorial/981551.html

      (0)
      上一篇 2021年12月12日
      下一篇 2021年12月12日

      精彩推荐