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>

我尝试将 <code></code> 标签放在 jQuery 中，有和没有转义字符。我尝试使用 .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

当您解析它时，它会被转换为纯文本并且<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 回答