Question

我希望在提交时在新div中显示文本字段的内容，每次单击文本字段下的提交按钮时，我都会创建一个新的div。

例如，Person A输入'hello'并点击提交，'hello'现在显示在页面的其他位置。

B人出现并再次输入'hello'并点击提交，'hello again'也会在第一个'hello'之后的下一个div中显示，等等。

这项功能是否可行？任何帮助将不胜感激。

Answer 1

我相信我已经使用jquery创建了一个你想要的例子：http://jsfiddle.net/sVgxa/

HTML：

<textarea id="input"></textarea>
<button id="submit">Enter</button>
<div id="newDivs"></div>

使用Javascript：

$('#submit').click(function() {
   var text = $('#input').val();
   $('#newDivs').append('<div>' + text + '</div>');
});

正如修剪所说，如果你想要在不同用户之间出现的东西，你需要使用Ajax更复杂的东西。

Answer 2

如果你可以使用jQuery -

HTML -

<input id="text-box" value="" />
<button id="submit">Submit</button>
<div id="message-wrapper"></div>

JavaScript -

$(document).ready(
        function() {
            $("#submit").click(
                    function() {
                        $("<div>" + $("#text-box").val() + "</div>").appendTo(
                                "#message-wrapper");
                    })
        });

Answer 3

您描述的内容看起来像简单的Ajax Web Chat应用程序。仅使用javascript将不足以获得您想要的内容。您可以查看此示例： http://net.tutsplus.com/tutorials/javascript-ajax/how-to-create-a-simple-web-based-chat-application/ 或谷歌如何创建Ajax聊天应用程序。有很多很好的例子说明如何使用不同的编程语言创建这样的应用程序。

每次用户提交文本时创建/显示新Div

3 个答案: