CODEWITHSUNDEEP
jquerypluginstinymcehandler
Somal Somalski
Somal Somalski

Reputation: 578

TinyMCE - jquery - cant' capture click in editor iframe

I have written simple plugin for tinyMCE that let's me setup tabs and content for tabs which results in html like this:

<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>

What I need is to let admin users click through tabs like it was frontend. Code, that handles switching tabs on frontend:

$(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();
    });
});

I have added this js and jquery manually by editing tiny mce source:

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>'

But click events are not catched by jquery. However I can console.log or alert something on $(document).ready, but clicks on tabs are not triggering written jquery functions.

I think that tinyMCE handles clicks prior to jquery, is it posibble to change that behavior?

Upvotes: 1

Views: 987

Answers (1)

Thariama
Thariama

Reputation: 50832

You should use the tinymce event onClick.

Upvotes: 1

Related Questions