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 イベントですが、DHTMLoriginalEventオブジェクトであり、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 に答える