0

アプリケーションに動的なツールチップを作成しようとしていますが、うまくいきません。

以下は、Java スクリプトを使用してツールのヒントを取得しようとする私のコードです。

<input type="text" tooltipid="testfamily" onclick="tooltipshow(this);" id="family"
    value="family " />

<script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript">
var data = {
    name: "enter your name",
    family: "enter your family",
    testfamily: "enter your family",
    uc1_txtname: "enter your name for Control 1 (User Control1)",
    uc2_txtname: "enter your name for Control 2 (User Control2)"
}
function tooltipshow(e) {

    var Tip = $("<div class='dinamictip'></div>");
    Tip.text('');

    var ToolTip = $(e).attr('tooltipid');
    if (ToolTip != null) {
        var offset = $(e).offset();
        var height = $(e).height() + 10;
        Tip.text(data[ToolTip]);
        Tip.css('position', 'absolute').css('left', offset.left).css('top', offset.top - height);
        Tip.appendTo('body');

        Tip.remove();

    }
};
4

1 に答える 1

1

私はあなたのコードをテストしませんでしたが、おそらく原因は次のTip.remove();とおりです。ヒントを作成するとすぐに削除しています。

関数でこの変更を試してくださいtooltipshow: このコードを初めて実行するとき、ツール ヒントの が見つからないため、ツール ヒントdivを作成して本体に追加します (今のところ非表示)。次にコードを呼び出すと、古いツール ヒントが検出され、再利用されます。

function tooltipshow(e) {

    var Tip = $("#mydinamictip");
    if(Tip.length==0){
        Tip = $("<div id='mydinamictip' class='dinamictip'></div>");
        Tip.hide().appendTo('body');
    }

    Tip.text('');

    var ToolTip = $(e).attr('tooltipid');
    if (ToolTip != null) {
        var offset = $(e).offset();
        var height = $(e).height() + 10;
        Tip.text(data[ToolTip]);
        Tip.css('position', 'absolute').css('left', offset.left).css('top', offset.top - height);
        Tip.show();

    }
};
于 2013-03-04T02:10:09.390 に答える