我为 tinyMCE 编写了简单的插件,让我可以设置选项卡和选项卡的内容,从而生成如下所示的 html:
<div class="tabs">
<nav class="content_menu">
<ul>
<li><a href="#tab-Tab1-0">Tab 1</a></li>
<li><a href="#tab-Tab2-1">Tab 2</a></li>
</ul>
</nav>
<div class="switcher">
<div id="tab-Tab1-0">
<article class="wide switch">
Content 1
<div style="clear: both;"></div>
</article>
</div>
<div id="tab-Tab2-1">
<article class="wide switch">
Content 2
<div style="clear: both;"></div>
</article>
</div>
</div>
我需要的是让管理员用户像前端一样点击标签。处理前端切换选项卡的代码:
$(document).ready(function() {
$('.tabs').on('hover', 'a', function(e) {
e.preventDefault();
$('nav.content_menu li').removeClass('selected');
$(this).parent().addClass('selected');
$('.switcher div').hide();
$($(this).attr('href')).show();
});
});
我通过编辑微小的 mce 源手动添加了这个 js 和 jquery:
t.iframeHTML += '<script type="text/javascript" src="/assets/js/jquery-1.9.0.min.js"></script>'
t.iframeHTML += '<script type="text/javascript" src="/assets/js/tinymce-kb.js"></script>'
但是点击事件不会被 jquery 捕获。但是,我可以在 $(document).ready 上使用 console.log 或警告某些内容,但是单击选项卡不会触发编写的 jquery 函数。
我认为 tinyMCE 在 jquery 之前处理点击,是否可以改变这种行为?