JQuery Невозможно связать событие размытия со всеми элементами <input> на странице

0

Я пытаюсь связать событие размытия со всеми элементами "ввода" на странице. Он имеет несколько входных элементов, есть некоторые элементы ввода даже внутри "iframe".

Я могу связать события размытия, которые находятся за пределами iframe, но не внутри.

Вот какой код я пробовал:

$('body iframe').contents().find('body').delegate('input','blur',function(e){
   alert('blur');
});

$('body,iframe').children().find('input').on('blur',function(e){
   alert('blur');
});

HTML-структура

<html>
    <body>
        <div id = abc> <!--start of abc div -->
            <form>
                <table>
                    <tr>
                        <input name="hello"/>  <!--  able to bind event to this input -->
                    </tr>
                </table>
            </form> 
        </div> // end of abc div

        <div id="pqr"> // start of pqr div
            <iframe name="e1menuAppIframe">  <!-- iframe element (Does have more properties) -->
                <html>
                    <body>
                        <div id="abc">
                            <form>
                                 <table>
                                     <tr>
                                         <input name="hello"/>      <!--not able to bind event to this input -->
                                     </tr>
                                 </table>
                             </form>
                         <!-- more forms -->
                    </body>
                </html>
            </iframe>
        </div>    <!-- end of pqr div -->
    </body>
</html>

Оба не работают для элементов внутри iframe.

Существует ли общее решение для привязки ко всем входным элементам внутри страницы, несмотря на iframes.

Также есть некоторые запросы, которые загружают динамические элементы iframe на страницу, а функции делегирования не являются обязательными событиями размытия для вновь добавленных фреймов.

  • 0
    Если вы проверите элемент в браузере, вы увидите еще один тег html и body внутри фрейма. Поэтому я думаю, что это проблема!
  • 0
    Содержимое Iframe приходит из другого домена? Другими словами, ваш Iframe открывает внешний URL?
Показать ещё 9 комментариев
Теги:
iframe
jquery-plugins

2 ответа

0
Лучший ответ

Я нашел приведенный ниже код для моих динамических фреймов, но он работает только для первого уровня iframe. На одной из моих страниц есть iframe внутри iframe для тех входных элементов, которые он не получает привязанными..

$('body iframe').load(function(){
    $("body iframe").contents().find('input').on('blur', function() {
                onblur(this); 
        });
    });
Поделиться
0

вам нужно обратиться к объекту document внутри этого iframe, вы не можете просто искать в jQuery в iframe. например

$("iframe").contents().find('input').on('blur', function() {
  console.log(this.name);
});

в основном проблема заключается в том, что window и iframe будут иметь отдельные контексты и документы, вы не можете просто переходить от одного к другому, вам нужно выбрать один из них в качестве контекста сначала

Поделиться
  • 0
    Николай: Я попробовал ваш код, он не работает.
  • 0
    Вместо того, чтобы давать имя iframe т.е.) «e1menuAppIframe» мы можем написать некоторый общий селектор, потому что может быть несколько iframe на странице, и моя цель состоит в том, чтобы связать событие размытия для всех элементов ввода на странице и выполнить некоторую функцию, основанную на это размытие
Показать ещё 7 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню