0

ユーザーがボタンを押すことに基づいて、ページの数字を更新しようとしています。私はそれを機能させていますが、数値が更新されると、テキストは <code></code> ブロックに入ったようにフォーマットされなくなります。これは、私が使用しているコードから、形式を制御するための努力を差し引いたものです。

<script>
    var countUp = function() {
        $("#num").html(parseInt($("#num").html()) + 1);
        $("#textWithNumInIt").html("The number is now"+$("#num").html() );
    }
</script>

<p id="textWithNumInIt"><code>The number is 0</code></p>

エスケープ文字の有無にかかわらず、jQuery 内に <code></code> タグを入れてみました。.val() と .text() を使用してテキストを設定し、書式設定をそのままにしてみました。数値自体の周りにスパンを使用しようとしましたが、値は更新されません。

javascript 関数内で jQuery を使用して HTML を変更したのはこれが初めてなので、問題はそれに関係している可能性があります。これを行うためのまったく異なる方法についてアドバイスがある場合は、共有してください。

4

3 に答える 3

2

textWithNumInIt段落の内容を編集すると、<code>その段落内のタグも自然に置き換えられます。これはうまくいくはずです：

$("#textWithNumInIt").html("<code>The number is now "+$("#num").text()+"</code>" );
于 2013-02-12T16:44:23.177 に答える
0

多分これを試してみてください-

$('#textWithNumInIt code').html("The number is now "+$("#num").text() )
于 2013-02-12T16:46:14.793 に答える
0

parseInt すると、プレーンテキストに変換され、<code>ラッパーはなくなります。これを使えば、あなたはあなたの道を歩むことができます。

var countUp = function() {
    var t = parseInt($("#num").text()) + 1);//using text() to avoid any unintentional html tag issues
    $("#num").html(t);
    $("#textWithNumInIt").html("<code>The number is now "+t+"</code>" );
}

または、簡単な編集を行うことでコードを続行できます。

var countUp = function() {
    $("#num").html(parseInt($("#num").html()) + 1);
    $("#textWithNumInIt code").html("The number is now"+$("#num").html() );
}
于 2013-02-12T16:50:22.807 に答える