HTML title属性不显示空格后面的字符串

问题描述

为了使鼠标移到 table 单元格上能悬浮显示单元格的完整内容，在 html 界面的 td 标签添加了 title 属性，但发现属性值有空格时只显示空格前的字符，不显示空格后面的字符。

问题原因

table 的 tr、td 标签及属性都是在 js 文件里面拼装的，用单引号 ” 来连接字符串，然后填充tbody，html 解析时应该是把空格后的字符又当标签的属性进行处理导致的。

info = info  
+'<tr class>'       
+'    <td width="24%"><button style="display:none">'
+'    <td width="15%" class="color-1faf48 textLeft" title='+userName+'>'+userName+'</td>        '  
+'    <td width="25%" class="textLeft" title='+createTime+'>'+createTime+'</td>       '  
+'</tr> '  
;
...

$("#virtualServerList").html(info);

<table class="folder-table" cellpadding="0" cellspacing="0" width="100%">
    <tbody id="virtualServerList">
    </tbody>
</table>

解决方法

给 title 属性值再加一层双引号（如果外层为双引号，则加单引号），这样保证引号内的值为一个完整的字符串，如下：

+'    <td width="25%" class="textLeft" title="'+createTime+'">'+createTime+'</td>       '

---