Up to 50 percent off

jQuery pop up in rich editor

This topic contains 3 reply and 2 voices, and was last updated by Tareq Hasan 10 years, 11 months ago
Viewing 3 Posts - 1 through 3 (of 3 total)
Author Posts
December 4, 2013 at 3:48 am 13233
Tareq Hasan I have literally been working on this everyday for a week and I can't figure it out. I need to add a jQuery tool tip to a rich text box and I'm having a very difficult time getting it to work. I have no problem doing this on the regular (teeny) text box but, since the rich editor is in an iframe, I can't get it to fire. Here's the code I'm using to show a tooltip when users click in the teeny excerpt editor; I've included the php just in case that's a factor. This code works: 
//WPUFE Javascript
function wpufe_javascript() {
  if ( is_page('submit-announcement') ) {
		?>		
	    <script type="text/javascript">

	        (function($) {
	 
							$( "label[for=wpuf-post_excerpt]" ).append( '<div class="announcement-excerpt-tooltip" style="display: none;"><p>This is the message that will appear in listserv emails. Make sure to include details if needed. <strong>Do not repeat the title here or it will appear twice!</strong></p></div>')	            

	            $('#post_excerpt').on('focus', function(event) {
	                $( ".announcement-excerpt-tooltip" ).show("slow");
	            });
	            
	            $('#post_excerpt').on('focusout', function(event) {
	                $( '.announcement-excerpt-tooltip' ).hide("slow");
	            });

	        })(jQuery);
	    </script>
		<?php
	}
}
add_action( 'wp_footer', 'wpufe_javascript',20 );
I can even modify the contents of the iframe by replacing the action in the code above with the following: $('#post_content_ifr').contents().find('.mceContentBody').html("<p>George</p>"); But I can't figure out how to add the same kind of click event to the iframe that I have for the teeny editor text area. I've spent hours reading and tried it a hundred different ways but I'm not having much luck. Any suggestions?
December 4, 2013 at 1:02 pm 13267
Tareq Hasan Tareq Hasan

I think you’ve to handle directly via TinyMCE, may be with an onClick event.

December 4, 2013 at 8:40 pm 13306
gpspake gpspake

@Tareq,
I’ve stumbled across that page and several examples of people using it but I can’t seem to get it to work in my code.

December 5, 2013 at 12:49 pm 13357
Tareq Hasan Tareq Hasan

This works:
[js]
var content = tinyMCE.getInstanceById(‘post_content’);
content.onClick.add( function(){
console.log(‘clicked on me’);
});
[/js]

Viewing 3 Posts - 1 through 3 (of 3 total)
Coupon
Coupons