HTML editor accessing quicktag buttons

5 Views

I’m stuck in searching a way to access the quicktag buttons on the html editor with jQuery. I tryed to access the buttons with .each() and .children() but both won’t work. 

jQuery( document ).ready( function( $ ) {

  $( '#ed_toolbar input.ed_button' ).children().css( 'color', 'red' );

  $( '#ed_toolbar input.ed_button' ).each( function() {
    $( this ).css( 'color', 'red' );
  });


});

I think the buttons are not inserted when the DOM is ready.

Post Views: 5

Related posts

Leave a Reply

1 comment

  1. I wrote a jQuery plugin to check every 0.5 seconds if the toolbar has the requested element.

    (function( $ ) {
/**
 * Wait until element has finish loading requested elements, then execute callback 
 * @param string element Element to wait for
 * @param object callback Callback to execute
 * @param integer timeout Optional timeout to stop testing the element if none of the requested element was found
 */
$.fn.waitEdToolbarLoaded = function( element, callback, timeout ) {

    var interval = null;
    var target = this;
    var timeout = typeof timeout !== 'undefined' ? timeout : 5000;

    interval = window.setInterval(

        function () {

            var length = $( target ).find( element ).length;
            timeout -= 500;

            if( 0 > timeout  ) {
                window.clearInterval( interval );
            }

            if( 0 < length ) {
                window.clearInterval( interval );
                callback();
            }
        },
        500
    );

}
})( jQuery );

    And a simple example how to use it

    jQuery( document ).ready(
function( $ ) {

    // callback to execute if the requested element was found
    function alarm() { alert( 'Toolbar ready!' ); }

    // wait for elements
    $( '#edtoolbar' ).waitEdToolbarLoaded( 'p', alarm );

    // create the elements after 3 seconds
    setTimeout(
        function () {
            for ( var i=1; i<4; i++ ) { $( '#edtoolbar' ).append( '<p>'+i+'</p>' ); }
        },
        3000
    );

}
);

    Maybe the plugin need some improvements, but it could be usefull in other situations too.