Question

我在问是否有人可以给我一个简单的javascript代码，该代码会将用户在textarea中写入的文本放入用户点击提交按钮时创建的新div中。

以下是表格：

       <form id="myForm" class="myForm" action="profile.php" method="post" target="hidden-form" >

Write text here: 
<textarea name="comment" id="comment" placeholder="comment here" rows="1" cols="40" ></textarea>
<input type="submit" name="submit" id="submit" value="submit" "/>
</form>
<IFRAME style="display:none" name="hidden-form"></IFRAME>

Answer 1

试试这个：

<html><head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js">    </script>
<script type="text/javascript" >
    function updateDiv()
    {
        var x = $('#comment').val();
        $( "#UserCommentsDiv" ).append("<div>" + x + "</div>");
    }
</script>
</head>
<body>
    <form id="myForm" class="myForm" action="profile.php" method="post" target="hidden-form" >
        Write text here: 
        <textarea name="comment" id="comment" placeholder="comment here" rows="1" cols="40" ></textarea>
        <input type="submit" name="submit" id="submit" value="submit" onclick="updateDiv();"/>
    </form>

    <div id="UserCommentsDiv"></div>
    <IFRAME style="display:none" name="hidden-form"></IFRAME> 
</body>
</html>

DEMO

Answer 2

也许在profile.php中有类似的东西

<?php 

$comment = $_POST['comment'];

?>

然后在您想要的div中添加它。

<?php echo $comment; ?>

Answer 3

这是纯javaScript解决方案

<强> HTML

<form >
<div id="container">
<textarea name="comment" id="comment" placeholder="comment here" rows="1" cols="40" ></textarea>
<br />
<input type="button" name="submit" id="submit" value="submit" onclick="storeData()"/>
</div>

</form>

<强>的javaScript

function storeData(){
    var commentTag = document.getElementById('comment');

    var newDiv = document.createElement('div');
    newDiv.id = "result";
    newDiv.innerHTML = commentTag.value;

    var submitTag = document.getElementById('submit');
    parDiv = document.getElementById('container');
    container.insertBefore(newDiv, submitTag);
}

更新

在form中使用时，您的输入类型应为button而不是submit

舒尔德

<input type="button"

而不是

<input type="submit"

DEMO

当用户点击“提交”时，在其上方创建一个包含textarea文本的新div。 - JavaScript或PHP

3 个答案: