2

タグの内容の HTML エンティティを評価して表示する (つまり、エスケープしない) 方法で、ノックアウト js を介して HTML タグのタイトル属性を設定するにはどうすればよいですか?

例：

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

上記の例では、titleObservable に HTML エンティティが含まれている場合、レンダリングされず、エンティティ名が表示されます。実際の例については、このフィドルを参照してください。div にカーソルを合わせると、タイトル テキストにアポストロフィ記号の代わりに ' が含まれていることに注意してください。

ノックアウトjsテキストバインディングを使用してHTMLタグのコンテンツを設定する場合、セキュリティ上の理由からHTMLがエスケープされることを知っています（このスレッドを参照）。これが私のタイトル属性のエンティティに起こっていることだと思います。また、タイトル属性にアポストロフィを直接埋め込むことができることも知っていますが、HTML エンティティでこれを行う方法があるかどうかを知りたいです (私が取り組んでいるプロジェクトの特定の制限のため)。

4

1 に答える 1

4

(Knockout バインディングが使用する) Javascript 内で 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/

于 2013-04-03T00:14:27.580 に答える