3

データベースからコンテンツを取得する改札 MultiLineLabel があります。ここで、この MultiLineLabel テキストを、ページ上のホバー時にツールチップとして表示する必要があります。

これについてどうすればよいか教えてください(私はウィケットが初めてです)。jqueryソリューションを使用する必要がありますか、それとも自分のページにonmouseoverandを追加する必要がありますか?onmouseout AjaxEventBehaviors

jquery ソリューションを試したとき、ツールチップで改行を維持する方法がわかりません。

あなたが持っている例を教えてください。

4

1 に答える 1

3

私はこれを標準ラベルでテストしましたが、動作します:

Label ml;
String msg = "Hello! \n I'm here.";
add(ml = new Label("multiline",msg));
ml.add(AttributeModifier.append("title", msg));

更新しました

残念ながら、属性 'title' で生成されるツールチップのスタイルを制御することはできません。これは、OS ネイティブ コンポーネントであるためです。ただし、 http://www.mkyong.com/jquery/how-to-create-a-tooltips-with-jquery/で見つけたコードを簡単に適応させることができます。ツールチップのテキストをカスタム属性に入れることができます。それを「toolTipText」と呼びましょう:

String tooltipMsg = Strings.toMultilineMarkup(yourMsgFromDb).toString(); 
...
yourLabel.add(AttributeModifier.append("toolTipText", tooltipMsg));

ツールチップの改行を維持するには、toMultilineMarkup を使用する必要があることに注意してください。ここで、関数 showTooltip を少し変更して、カスタム属性に挿入された値を使用する必要があります。

var showTooltip = function(event) {
  $('div.tooltip').remove();

  $('<div class="tooltip">' + $(this).attr('toolTipText') +'</div>')
            .appendTo('body');

  changeTooltipPosition(event);
};

最後に、タグでツールチップを使用するように JQuery に指示する必要があります。「span#hint,label#username'」をコンポーネントに一致するセレクターに置き換える必要があります。

私はテストしましたが、うまくいくようです。

于 2012-09-03T14:51:20.127 に答える