2

div にラップされた 3 つのスパンがあるとします。

<div>
    <span>1/1/2000</span>
    <span>-</span>
    <span>1/2/2000</span>
</div>

ブラウザーは、結果の表示が次のようになるように、スパン間の改行を空白として解釈することになっています。

1/1/2000 - 1/2/2000

...これらのどれも好きではありません

1/1/2000-1/2/2000
1/1/2000- 1/2/2000
1/1/2000 -1/2/2000

...これは、スパンにノックアウト バインディングがない場合の IE8 の場合です。IE8 開発者ツールを使用して上記のマークアップを調べると、各スパンの後に" Text - Empty Text Node " が明確に表示されます。

<div>
    <span>1/1/2000</span>
    Text - Empty Text Node
    <span>-</span>
    Text - Empty Text Node
    <span>1/2/2000</span>
    Text - Empty Text Node
</div>

ただし、このようにスパンにノックアウト バインディングを配置するとすぐに、空のテキスト ノードの動作が変わります。

<div>
    <span data-bind="text: start"></span>
    <span data-bind="visible: end">-</span>
    Text - Empty Text Node
    <span data-bind="text: end"></span>
    Text - Empty Text Node
</div>

... 最初の 2 つのスパンの間の空のテキスト ノードが削除されているように見えます。これはノックアウトバグですか？回避策はありますか？これはバージョン 2.3.0 を使用しています。

4

1 に答える 1

3

knockout::text-binding のドキュメントで説明されている空白には問題があります (注 4を参照してください。お使いの IE にQuirk モード : ONがある可能性があります)。
Knockout の解決策は、何かを に置くことspanです。 

<div>
    <span data-bind="text: start">&nbsp;</span>
    <span data-bind="visible: end">-</span>
    <span data-bind="text: end">&nbsp;</span>
</div>

spanまた、単一の要素を 使用することもできます:

<div>
    <span data-bind="text: start + (end ? ' - ' : '') + end"></span>
</div>
于 2013-10-12T22:06:11.443 に答える