获取JQuery作用于由GWT动态添加的类名称

我试图让jquery在使用GWT时对我造成一些影响。我有添加到页面的通知，点击时应该消失。由于可能有多个相同类型的通知（警告，错误等），我试图动态添加一个样式名称，只有当它们通过GWT单击时，然后让jquery按照该特定类名称操作。获取JQuery作用于由GWT动态添加的类名称

问题是，jquery函数在可以添加样式名称之前触发，因此用户必须单击通知两次才能关闭它。

任何想法？

public abstract class AbstractNotificationWidget extends Composite implements ClickHandler, HasClickHandlers { 

    protected abstract String getUniqueId(); 

    @Override 
    public HandlerRegistration addClickHandler(ClickHandler handler) { 
    return addDomHandler(handler, ClickEvent.getType()); 
    } 

    @Override 
    public void onClick(ClickEvent event) { 
    doClick(getUniqueId()); 
    } 

    protected static native void doClick(String name) /*-{ 
    $wnd.$("#" + name).click(function() { 
     $wnd.$(this).slideUp("slow"); 
     $wnd.$("div", this).fadeOut("slow"); 
     }); 
    }-*/; 

}

我那么具有延伸上面的类

public class ErrorNotificationWidget extends AbstractNotificationWidget { 

    private final String uniqueId; 

    public ErrorNotificationWidget (String title, String message) { 
    uniqueId = DOM.createUniqueId(); 

    initWidget(uiBinder.createAndBindUi(this)); 

    this.getElement().setId(uniqueId); 

    this.addClickHandler(this); 
    } 
    @Override 
    protected String getUniqueId() { 
    return this.uniqueId; 
    }

这些子类使用UiBinder的确定应该如何绘制的子类。然后将这些小部件添加到要显示的面板中。

来源

2010-02-17 Josh

您能否提供更多的源代码 - 您发布的部分不完全足以查看发生了什么问题。你也许想把'styleName.equals'改成'styleName.contains';）另外，使用'FocusPanel'作为你的'mainWidget'可能比自己处理'ClickHandler'注册要容易一些:)而且你可能想要切换到DOM.createUniqueId（）的命名通知小部件（我认为其中有一些） - 你不会一次隐藏所有的小部件;） – 2010-02-17 23:55:34

感谢您的评论。这绝不是最终的代码，所以肯定有一些清理，但包含的想法是一个很好的。 DOM.createUniqueId（）方法也可能是一个好主意，但是如果小部件在第一次点击时关闭，那么这并不重要。我不知道我可以发布更多的代码。我有扩展这一个的子类，并添加他们自己的样式，使它们看起来像一个错误或警告。虽然我会用最新版本的代码来编辑我的帖子。 – Josh 2010-02-18 00:39:36

我添加了更多代码。创建通知实例时，我开始添加唯一标识，但仍需要2次点击。我必须失去一些明显的东西。 – Josh 2010-02-18 14:10:10

你到底想要达到什么目的？基于它应用的样式或它的ID隐藏小部件？（在当前版本中，您似乎正在混合使用）

如果ClickEvent正在快速烧制（可以通过在其之前添加超时进行测试），则可以尝试将其封装在DeferredCommand中。

另一种可能性是jQuery正在加紧;）在jQuery/Mootools中使用回调函数时，我遇到了一些奇怪的问题 - 原因是这些框架扩展/更改function()（除其他外） - 但是，JSNI的东西被执行从一个“干净的”iframe，没有任何jQuery所做的更改（这就是为什么你必须通过$wnd参考主窗口）。您可以测试，如果是这样的问题，在这里通过定义，例如，在你的HTML网页测试功能，然后把它当作回调函数在void doClick(String name)方法：

protected static native void doClick(String name) /*-{ 
    $wnd.$("." + name).click($wnd.jqueryTest); // BTW, why '"." + '? 
}-*/;

，就连最初的建议仍然有效 - 使用FocusPanel作为你的主要部件 - 试图正确实施HasClickHandlers（和类似的接口）是从我的经验PITA，可以导致怪异的错误和/或内存泄漏。

来源

2010-02-18 17:05:08

我想创建很多通知，并能够单独关闭它们。如果我给他们所有相同的DOM类名称，jquery将关闭所有这些。当你在gwt中调用addStyleName（name）时，它将该名称添加到该元素的DOM类中。 “。” + name是这样的jquery拉名称（.gwt-12-whatever）而不是“.name”。我很欣赏使用FocusPanel的建议，但我无法做到这一点。我需要它是一个综合。此外，我不相信这是任何东西的速度，因为即使当我在初始化时创建名称，在它被点击之前，我仍然需要点击两次。 – Josh 2010-02-18 21:21:36

你误会了我关于'FocusPanel'的问题 - 我想让你在UiBinder模板（绑定到特定的通知窗口小部件）中将它用作你的根/主面板。然后你可以简单地调用'focusPanel.addClickHandler（不管）“（而不是自己实现'HasClickHandlers'等）。关于样式名称 - 不是通过样式名称搜索元素，而是通过id来更快速地（并且不容易出错） - 因为在DOM中不应该有两次具有相同ID的元素（即为什么我建议使用'DOM.createUniqueId'）。 – 2010-02-18 22:33:59

如何通过gwt添加一个id？我只知道添加到DOM类的函数addStyleName（）。 – Josh 2010-02-19 00:01:27

也许你应该尝试GWTQuery http://code.google.com/p/gwtquery/，而不是尝试本地集成它。

来源

2010-02-17 22:57:35 malte

类添加到您想要关闭上单击该元素，即

<div class="close-on-click">Content</div>

你的JavaScript可以自动绑定功能选择匹配任何现有的或动态创建的元素：

$('.close-on-click').live('click', function() { 
    $(this).remove(); 
});

来源

2010-02-18 08:47:49 aceofspades

这实际上是我想要做的，除非我不能在ui.xml中硬编码“close-on-click”，因为那个小部件的每个实例都会得到相同的类名，并且会在任何一个他们被点击。感谢您的回应。 – Josh 2010-02-18 14:00:33

如果链接位于要关闭的元素中，请尝试以下操作： $（'a.close'）。live（'click'，function（）{ $（this）.parents（'。class-to -close：first'）。remove（）; }）; – aceofspades 2010-02-19 16:30:18

您的代码需要两次点击，因为您在第一次点击（通过onclick方法）上安装了Jquery点击绑定事件，因此最后一次点击会产生反应。更改你的代码类似的东西：

protected static native void doClick(String name) /*-{  
     var $_this = $("#" + name); 
     $_this.slideUp("slow");  
     $wnd.$("div", $_this).fadeOut("slow");  
}-*/;

仅供参考，您可以使用GwtQuery（jQuery的的GWT克隆）和代码应该看起来像：

import static com.google.gwt.query.client.GQuery.$; 

public abstract class AbstractNotificationWidget extends Composite implements ClickHandler, HasClickHandlers {  

@Override 
public HandlerRegistration addClickHandler(ClickHandler handler) {  
    return addDomHandler(handler, ClickEvent.getType()); 
}  

@Override 

public void onClick(ClickEvent event) {  
    $(this).slideUp(Speed.SLOW); 
    $("div", getElement()).fadeOut(Speed.SLOW); 
}  

}

无需使用UNIQUEID

来源

2011-03-10 14:10:48 jdramaix

获取JQuery作用于由GWT动态添加的类名称

回答

相关问题