无法在工具提示中显示格式化的HTML

Question

我有一个现有的Classic ASP网站，我正在将其转换为C＃/ ASP.NET。在此旧版站点中，他们使用以下代码作为工具提示来显示HTML数据（与纯文本相对）。现有代码使用HTML格式化某些表，然后使用折旧方法将其作为工具提示。示例：

function EnterContent(layerName, TTitle, TContent, RecordNum) {
        ContentInfo = '<table border="1" style="width: 200px; border-top-color: #808080; border-right-color: #808080; border-bottom-color: #808080; border-left-color: #808080; padding:0; border-spacing:0 ">' +
        '<tr><td style="width: 100%; border-top-color: #000000; border-right-color: #000000; border-bottom-color: #000000; border-left-color: #000000">' +
        '<table border="0"   style="width: 100%;padding: 0; border-spacing: 0; background-color: #C0C0C0">' +
        '<tr><td style="width: 100%; border-top-color: ' + topColor + '; border-right-color: ' + topColor + '; border-bottom-color: ' + topColor + '; border-left-color: ' + topColor + '">' +
        '<table style="width: 100%;padding :0;border-spacing: 0;text-align: center" >' +
        '<tr><td style="width: 100%; background-color: #0000FF">' +
        '<div class="tooltiptitle">' + TTitle + '</div>' +
        '</td></tr>' +
        '</table>' +
        '</td></tr>' +
        '<tr><td style="width: 100%; border-top-color: ' + subColor + '; border-right-color: ' + subColor + '; border-bottom-color: ' + subColor + '; border-left-color: ' + subColor + '">' +
            '<table {padding:5} style="width: 100%;border-spacing: 0;text-align: center">' +
            '<tr><td >' +
            '<font class="tooltipcontent">' + TContent + '</font>' +
            '</td></tr>' +
            '</table>' +
        '</td></tr>' +
        '</table>' +
        '</td></tr>' +
        '</table>';

        ReplaceContent(ContentInfo, RecordNum)
    }

这是他们在旧版代码中的处理方式：

 function ReplaceContent(layerName){
   if(ie){document.all[layerName].innerHTML = ContentInfo}

   if(ns){
          with(document.layers[layerName].document) {
                 open();
                 write(ContentInfo);
                 close();
          }
   }

}

注意，它使用文档层来填充工具提示。这已贬值，不适用于现代浏览器。这是我想出的：

       function ReplaceContent(ContentInfo, RecordNum) {
        var HTMLElement = document.getElementById(RecordNum)
    //    alert(ContentInfo)
        HTMLElement.title = ContentInfo

}

这类作品。它显示了一个工具提示，但是工具提示中的信息是HTML格式表的纯文本。我不确定您是否可以成功地将HTML填充到工具提示中（我见过帖子说可以，不能）。

在我的版本中，RecordNum是控件ID（在这种情况下，它是第一行中的TD）。此处的示例：

       <b>1.</td><td width="100%" ID= \"" + aActions[i,0] + "\" runat=\"server\ "><span onMouseover="EnterContent('ToolTip','New Assignment','<b>Action Taken by:</b>
            <br>SOMEONES NAME<br>on Monday, October 28, 2019<br>at 9:11:50 AM EST<fieldset style=padding:2>
            <legend><b>Comment</b>
            </legend> SOMEONES NAME has been assigned as Person initiating the Help Call (Caller).</fieldset>'); Activate();"' 
            onmouseout="deActivate()">

这是打开链接页面的第二部分（它工作正常）：

   <a href="javascript:ActionDetail(2257126);"><font class="ActionName"><b>New Assignment</a></span> </font><br></font>
            <span id="actionspan2" style="display=none;"><font class="ActionData"> SOMEONES NAME <br>on Monday, October 28, 2019<br>
            at 9:11:50 AM EST<br></span>
            </font></td></tr><tr><td width="19" valign="top"><center><font class="ActionData">

这里提示应该显示为

所以，我的问题是我可以在工具提示中获取正确的文本，但是它不能以HTML格式显示。我已经测试了HTML代码，以确保这不是问题。我将其粘贴到.aspx页中，并验证了它可以正确显示。我绝对不是Java语言专家，因此如果我有后续问题，请提前道歉。

Answer 1

几个想法：也许您可以在创建链接时创建工具提示信息（而不是动态创建）。当您将鼠标悬停在信息上时，也可以使用ajax调用来获取信息。

此处找到的代码是在CSS中使用工具提示的好方法：https://www.w3schools.com/howto/howto_css_tooltip.asp

似乎您正在更改标题。原始代码更改了innerHTML。您仍然可以使用以下语法分配div的innerHTML：

document.getElementById（RecordNum）.innerHTML =“无论”;

我也是jQuery的忠实拥护者，它具有许多内置的UI功能：https://jqueryui.com/tooltip/