dps123456789
2014-03-16 18:30
浏览 17
已采纳

当用户点击“提交” - javascript或php时,使用textarea上面的文本创建一个新的div

I am asking if someone can give me a simple javascript code that will place the text written by a user in a textarea into a new div created when the user clicks on submit button.

Here is the form:

       <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> 
  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

3条回答 默认 最新

  • dongpao5127 2014-03-16 18:50
    已采纳

    Try this out:

    <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

    已采纳该答案
    评论
    解决 无用
    打赏 举报
  • doula4096 2014-03-16 18:47

    Maybe with something like this in profile.php

    <?php 
    
    $comment = $_POST['comment'];
    
    ?> 
    

    Then add this in your div where you want.

    <?php echo $comment; ?>
    
    评论
    解决 无用
    打赏 举报
  • dongwen4630 2014-03-16 18:53

    Here is the pure javaScript solution

    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);
    }
    

    UPDATE

    When use in form your input type should be button instead of submit

    Shuld be

    <input type="button"
    

    instead of

    <input type="submit"
    

    DEMO

    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题