2012-03-08 4 views
4

У меня есть jwysiwyg Редактор содержимого на моей странице. Управление работает, создавая себя в iframe, который содержит полный HTML-код страницы внутри него.JQuery обнаружение изменения или keyup на теге тела в iframe

Я хочу определить, был ли change или keyup, поэтому я могу использовать наш код «указать, что запись должна быть сохранена». У нас есть поля ввода, и эта работа прекрасна, просто этот редактор сторонних редакторов дает нам проблемы.

Вот что исходная страница выглядит следующим образом:

<div id="this_is_our_div_Container"> 
    <div class="wysiwyg"> 
     <iframe id="f_Body-wysiwyg-iframe"> 
      <html> 
      <body style="margin: 0;" class="wysiwyg"> 
       I just typed this now!</body></html> 
     </iframe> 
    </div> 
    <textarea class="wysiwyg" cols="20" id="f_Body" name="f_Body" rows="2" 
     style="display: none;"></textarea> 
</div> 

Смотрите, что тег тело содержит изменения в режиме реального времени.

С этими вопросами SO ...

jQuery 'if .change() or .keyup()'

https://stackoverflow.com/a/1639342/511438

Я попробовал следующее document.ready:

$('iframe').contents().find('body.wysiwyg').live('change', function (e) 
{ 
    alert('testing'); 
}); 
$('iframe').contents().find('body.wysiwyg').live('keyup', function (e) 
{ 
    alert('testing'); 
}); 
$('iframe > *').bind('keyup', function (e) 
{ 
    alert('testing'); 
}); 

Надеюсь, это поможет PrintScreen. LARGER enter image description here

+0

Так в чем ваш вопрос? –

+0

Вы серьезно? Хорошо, как я могу связать событие с тегом body, чтобы обнаружить штрихи? –

ответ

6

Вы, кажется, по правильному пути.

Интересно, будет ли это работать на вас:

$('elementSelector', $('iframeSelector').contents()).on('keyup', function(e) { 
    alert('testing'); 
}); 

Так что в вашем случае, я полагаю:

$('body.wysiwyg', $('iframe#f_Body-wysiwyg-iframe').contents()).on('keyup', function(e) { 
     alert('testing'); 
}); 

Хотя с помощью кода в этот ответ зависит от того, с помощью version 1.7 or higher of jQuery.

Если вы используете старую версию jQuery, вы можете использовать live, который устарел с версии 1.7 или, возможно, делегировать. Я не слишком уверен. Лучше всего использовать последнюю версию jQuery с .on() и .off().

+0

Хорошо! Ура! Кроме того, спасибо за подсказку о том, что жизнь обесценивается. LOL, я только принял его на днях. Теперь я собираюсь обновить этот код. –

+0

@Houdmont Это похоже на работу, но не в IE7, IE8 или IE9. Есть ли обновление к этому? –

1

Я не уверен, если у вас есть доступ к редактированию внутреннего содержимого фрейма, но у меня был аналогичная проблема, и это работает для меня:

Внутри корпуса IFrame:

$(document).ready(function(){ 
    $("body").live('keyup', function(){ 
     window.top.window.iChanged(); 
    }) 
}); 

В пределах содержание родительской страницы html:

function iChanged(){ 
    alert("I changed"); 
} 
Смежные вопросы