Question

如何通过knockoutjs设置HTML标签的title属性，以便评估和显示标签内容中的任何HTML实体（即不进行转义）？

示例：

<div data-bind="attr: { title: titleObservable }"></div>

在上面的示例中，如果titleObservable包含HTML实体，则不会呈现它，而是显示实体名称。有关工作示例，请参阅此fiddle。请注意，当您将鼠标悬停在div上时，标题文本包含＆amp;＃39而不是撇号符号。

我知道在使用knockoutjs文本绑定设置HTML标记的内容时，出于安全原因，HTML会被转义（请参阅this thread）。我假设这是我的title属性中实体发生的事情。我也知道我可以直接将撇号嵌入到title属性中，但我想知道是否有一种方法可以用HTML实体做到这一点（由于我正在处理的项目的某些限制）。

Answer 1

在Javascript（Knockout绑定使用）中使用HTML实体的唯一方法是innerHTML。对DOM的所有其他访问都使用UTF-8文本。

我建议您更新代码以在模型中使用纯文本，并仅在实际HTML文档中使用HTML实体。但是如果你不能这样做，你可以使用自定义绑定处理程序，在设置DOM属性之前将其从HTML转换为文本。这是我刚刚制作的标题。

ko.bindingHandlers.myTitle = {
    update: function(element, valueAccessor) {
        var value = ko.utils.unwrapObservable(valueAccessor());
        var d = document.createElement('div');
        d.innerHTML = value;
        element.title = d.innerText;
    }
};

示例：http://jsfiddle.net/mbest/TMSHB/2/

使用包含HTML实体的值设置HTML标记属性，通过knockoutjs

1 个答案: