Использование инструментов jQuery из GWT - есть ли способ разрешить обмены? - PullRequest
Новая
       6

Использование инструментов jQuery из GWT - есть ли способ разрешить обмены?

1 голос
/ 28 мая 2010

У меня есть веб-приложение GWT с почти полностраничным окном карты Google. Внутри карты у меня есть информационные окна, которые содержат ссылки. Я хочу использовать наложения инструментов jquery (http://flowplayer.org/tools/overlay/apple.html), чтобы открыть наложение и отобразить его поверх карты после щелчка по ссылке внутри информационного окна.

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

    function changeSource(url){
         $("#menuIFrame").attr("src",url);
    }

Чтобы вызвать это перед открытием оверлея (что делается при отпускании мыши), я создаю следующий элемент в информационном окне карт Google через GWT: 

<a href="http://whatever.com/menu/" onClick="changeSource('http://whatever.com/menu/');" rel=#menu"> View menu </a>

Инструменты Jquery работают, открывая любой div, у которого есть id, присвоенный значению 'rel', но, поскольку у меня есть мой javascript / jquery в моем LandingPage.html в GWT, между ними, похоже, есть какое-то расхождение оверлей никогда не добавляется в окно.

Вот мое приложение: http://truxmapper.appspot.com/

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

Кто-нибудь знает решение, которое позволит мне достичь моей цели? Спасибо!

Ответы [ 2 ]

2 голосов
/ 28 мая 2010

Нажав на ссылку, вы откроете страницу в текущем окне, так как ничто ее не остановит. Обработчик onclick для ссылки должен возвращать false, чтобы предотвратить действие по умолчанию (открытый URL). Это должно выглядеть так: 

<a href=".." onClick="changeSource(..); return false;" rel=#menu">View menu</a>

Обратите внимание на возврат false после вызова changeSource. Или вы можете изменить changeSource, чтобы он возвращал само значение и просто возвращал все, что возвращает changeSource. Функция changeSource будет выглядеть так: 

function changeSource() {
    // do some work
    return false;
}

Ссылка становится: 

<a href=".." onClick="return changeSource(..);" rel=#menu">View menu</a>

Это останавливает навигацию по странице и должно работать так, как ожидается. Если этого не произойдет, скорее всего, это проблема с инструментами jQuery. В моем тестировании всплывающее окно не отображалось по умолчанию, поскольку <div class="menu_overlay">..</div> было скрыто с помощью CSS. Я сделал еще одну хакерскую попытку показать это, изменив onClick следующим образом: 

onClick="$('.menu_overlay').show(); return changeSource(..);"
1 голос
/ 28 мая 2010

Этот ответ дал мне некоторую информацию, которая мне показалась полезной, но в нее не входило «решение», которое я нашел.

Я не смог найти метод, чтобы ссылка изнутри GWT активировала селектор jQuery «a [rel]», используемый инструментами jQuery. Однако, поскольку это было сделано для функции javascript, я просто объявил оверлей: 

$(function() {
$("#menu").overlay({effect: 'apple', mask: 'gray'});

});

и изменил функцию changeSource на: 

    function changeSource(url){
    $("#menuIFrame").attr("src",url);
    $("#menu").overlay().load();
}

Теперь изнутри GWT ссылка имеет вид href = "javascript: changeSource ('menu_url.html');" и это, кажется, работает правильно.

Спасибо.

...