2

我想使用Strust2 jQuery 插件内部使用的publish/框架。subscribe

用户可以从列表中选择一个帐号或在文本框中键入它。

我想在文本框或选择选项更改时发布事件。所以用户只能输入文本框或从选择框中选择一些东西:

<s:textfield name="account"  onblur="$.publish('accountChanged',this,event)"/>
<s:select name="accountList" list="destinationAccounts"
    onblur="$.publish('accountChanged',this,event)"/>

下面是js:

$.subscribe('accountChanged', function(event, data) {
    alert("New data is: " + data.value);
    if ( event.target.id=='account') {
        //Do something
    }
}

以下是问题:

  1. data.value 仅适用于文本框,对于选择框data.value未定义。
  2. 我想知道哪个目标收到了事件。event.target.id不管用!我认为事件对象不是 jQuery 事件对象?

我查看了示例展示应用程序,但找不到任何内容。

$.publish是否正确调用方法?有没有更好的方法?

4

2 回答 2

2

如果您订阅主题,请保持每个标签的主题名称唯一,以便为标签分离处理程序。每次在事件中发布主题时都会创建新onblur事件。主题的textfield处理程序如您所描述的那样工作。该select标记不起作用,因为错误的参数作为data. 工作代码示例

<s:textfield name="account"  onblur="$(this).publish('accountChanged', this, event)"/>
<s:select name="accountList" list="{'list1', 'list2','list3'}" onblur="$(this).publish('accountListChanged', this, event)"/>
<script type="text/javascript">
  $.subscribe('accountChanged', function(event, data) {
    alert("accountChanged: " + data.value);
  });
  $.subscribe('accountListChanged', function(event, data) {
    alert("accountListChanged: " + data.parentElement.value);
  });
</script> 

如您所见,data.value未定义,因为data.parentElement.value应该使用。event.target.id不工作,因为event.originalEvent.target.id应该使用。该event对象是一个 jQuery 事件,但originalEvent它是 DHTML 对象,即blur.

我不知道您的要求,如果您需要订阅/发布事件或使用原始事件处理程序,我不能说在这种情况下什么更好。

于 2013-10-06T18:55:29.550 回答
0

下面的代码解决了我的问题:

由于我找不到任何发布/订阅框架的示例,我希望下面的示例对其他人有所帮助!

该jsp将是

你必须${this).publish不打电话$.publish

<s:textfield name="account"  onblur="$(this).publish('destinationChanged', this, event)"/>
<s:select name="accountList" list="{'list1', 'list2','list3'}" onblur="$(this).publish('destinationChanged', this, event)" emptyOption="true"/>
<s:textfield name="destinationAccount" type="hidden" />

JS将是

$.subscribe('destinationChanged', function(event, data) {
            //If user types in the textbox 
            //then get the value and make the select box shows an empty option 
        if( !!data.value){
            destinationAccount= data.value;
        $('#destinationKnownAccount').val($("#destinationKnownAccount option:first").val());
        } else{
             //The user selected an account from select box. 
             // So get the value from select box and clean textbox          
            destinationAccount= data.parentElement.value;
            $('#destinationUnknownAccount').val('');
        }
            //Set the hidden box        
        $('#destinationAccount').val( destinationAccount);


    });

如前所述,可以使用event.originalEvent.target.id来查找选择了哪个目标。

于 2013-10-07T10:13:17.147 回答