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 回答