2010-12-04 3 views
9

Я пытаюсь создать ссылку (якорь) в GWT, которую можно щелкнуть, и ее можно обработать ClickEvent, и в то же время этот якорь не перезагрузит страницу. В основном это означает, что href не должен быть установлен.GWT clickable link (anchor) без href

В JavaScript это делается так:

<a href="javascript:handleAnchorClick();">Link</a> 

или

<a href="#" onclick="return handleAnchorClick()">Link</a> 

где handleAnchorClick() возвращает ложь.

Что было бы лучшим способом добиться этого в GWT?

+0

Если установить HREF, который начинается с `# 'страница не будет перезагружаться, но стек истории будет изменен, и вы сможете ответить на это событие. – 2010-12-05 04:36:22

+0

Точно, стек истории изменен, и я не хочу иметь дело с этим, чтобы иметь ссылку с возможностью клика. – 2010-12-05 08:11:17

ответ

12

Используйте tha Anchor element и позвоните по номеру addClickListener() method и добавьте, что вам нужно. Этот анкер не перезагружает страницу.

+0

Да, это похоже на правильный путь. Теперь мне просто нужно найти способ использования Anchor с этим конкретным конструктором в UiBinder. – 2010-12-05 08:23:44

10

Слушателям рекомендуется в GWT обработчики используют

Что-то вроде этого:

Anchor a = new Anchor("hi"); 
a.addClickhandler(new ClickHandler() { 
    @Override 
    public void onClick(ClickEvent event) { 
      Window.alert("hi"); 
    } 

}); 
8

Как вы можете описать, используя HREF = "#" будет перезагрузить страницу.

Это то, что вы можете сделать в UiBinder:

<g:Anchor ui:field="myScriptedAnchor" href="javascript:;"> 
     MyScriptedAnchorText 
    </g:Anchor> 

После этого вы можете делать все, что вы хотите обработки ClickEvent в осуществлении вида.

@UiHandler("myScriptedAnchor") 
    void onMyScriptedAnchorClick(ClickEvent event) { 
     // TODO whatever you want to do... 
    } 
8

Не забудьте добавить стиль якорь в противном случае оно не ведет себя как обычный HTML ссылка:

.anchor { 
      text-decoration: underline; 
      font-weight: bold; 
      cursor: pointer; 
      display: block; 
     }