如何动态替换html文本？

Question

我正在添加文字“I Tot I Taw a Puddy Tat！”在准备函数中以这种方式使用jQuery到页面顶部：

$("#Twitterati").html("<h3>I Tot I Taw a Puddy Tat!</h3>").append(tweetiePie);

...但我想用这个文本输入控件的内容动态地替换那个占位符文本（“I Tot I Taw a Puddy Tat！”）：

<input type="text" name="inputQuery" id="inputQuery" placeholder="Enter something" style="display: inline-block;" />

...当Enter键被混淆时。我怎么能这样做？

我试过了：

$("#inputQuery").keyup(function(e) {
    if(e.keyCode == 13) {
        $("#Twitterati h3").val($("#inputQuery".val()));
    }
});

......而且这个：

$("#inputQuery").keyup(function(e) {
    if(e.keyCode == 13) {
        $("#Twitterati h3").replaceWith($("#inputQuery".val()));
    }
});

......但是没有人做过什么，我能看到......

更新

现在工作得很好;但是当inputQuery val替换text / caption / heading时，我希望推文能够刷新。 IOW，我可以将文本从“jquery”更改为“html5”，但我显示的推文仍然是jquery推文。我怎样才能刷新那个div？

Answer 1

试试这个：

$("#inputQuery").keyup(function(e) {
    if(e.keyCode == 13) {
        $("#Twitterati h3").html($(this).val());
    }
});

在此处缺少结束括号$("#inputQuery" <----
以及最后.val())); <----

的额外括号

Answer 2

修正此行

                                        v
$("#Twitterati h3").html($("#inputQuery").val());

.html()

使用.val()代替h3

Answer 3

替换"#inputQuery".val()

与

$("#inputQuery").val()

代码是：

$("#inputQuery").keyup(function(e) {
    if(e.keyCode == 13) {
        $("#Twitterati h3").html($("#inputQuery").val());
    }
});

Answer 4

你缺少关闭braket导致错误并用.html替换.val（）因为你要替换文本而不是值

$("#Twitterati h3").html($("#inputQuery").val());

但你原来是

$("#inputQuery".val())    //MIssing HERE

您也可以像

一样使用它

$("#Twitterati h3").html($(this).val());

'this'将自动指示inputQuery

Answer 5

您想要设置目标元素的HTML。此外，您可以使用“this”而不是再次按ID定位元素

$("#inputQuery").keyup(function(e) {
    if(e.keyCode == 13)
        $("#Twitterati h3").html($(this).val());
});

Answer 6

比特更安全

$("#inputQuery").keyup(function(e) {
    if(e.keyCode == 13) {
        $("#Twitterati h3").text(this.value);
    }
});