Вызов функции JavaScript, когда элемент полностью загружен - PullRequest
0 голосов
/ 11 апреля 2011

У меня в ModalWindow (из расширений калитки) следующий код (в html-файле):

<wicket:head>
<script src="static/js/scroll.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () { 
          ffscroll('.scroller2');
    });
</script>
</wicket:head>

<wicket:panel>
<div wicket:id="scroller2" id="scroller2" style="overflow-x: hidden; overflow-y: auto; height: 240px" class="scroller2 YYYY ZZZZ">
  .... 
</div>
</wicket:panel>

и scroll.js

function ffscroll(id) {
        $(id).scroll(function () { 
            alert(id);
        });
    };

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

Но в ModalWindow я увидел, что код JavaScript выполняется перед отображением модального окна, поэтому я предполагаю, что мне нужно вызвать ffscroll ('. Scroller2'); после отображения модального окна, Я не знаю, как это сделать.

Странно, что в firebug мой скрипт выглядит так:

function () {
  ffscroll(".scroller2");
  alert("aaadssd");
}

"вместо".

1 Ответ

6 голосов
/ 11 апреля 2011

Хорошей практикой является размещение вашего JS в файле ресурсов, а затем добавление его в любой компонент, который вы используете:

Для глобально определяемых файлов:

add(JavascriptPackageResource.getHeaderContribution("js/general.js"));

Для относительного пакета:

add(new JavascriptResourceReference(MyPage.class, "MyPage.js"));

Поскольку ModalWindow загружаются с использованием ajax, необходимые исходные файлы JavaScript будут загружены и запущены при обратном вызове ajax.

Или, если вы посмотрите на ModalWindow.show(final AjaxRequestTarget target), он добавляет JavaScript кAjaxRequestTarget используя target.appendJavascript(), вы можете переопределить метод show, чтобы добавить дополнительный JavaScript:

...
@Override
public void show(final AjaxRequestTarget target) {
    super.show(target);
    target.appendJavascript("ffscroll('.scroller2');");
}

Затем, когда обратный вызов Ajax вызывается в клиентском браузере, этот JavaScript будет запущен.

Надеюсь, что поможет

...