Question

在使用jQuery或JavaScript的htmlpage中，如何实现以下目标？

用户在textarea的问题中键入并按下输入按钮，然后在textarea下面的页面中动态显示相同的问题，用户可以输入尽可能多的问题。

当用户完成后，页面将通过提交按钮提交。

你能否提一下如何做到这一点？

Answer 1

试试这个开始：

<!DOCTYPE html>
<html>
<head>
  <title>Example</title>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
  <script type="text/javascript">
    $(document).ready(function() {
      $('#textareabutton').click(function(){
        var q  = $('#textarea').val(),
            $p = $('<p>').html( q );
        $('#questions').append( $p );
      });
      $('#submit').click(function(){
        var tab;
        tab = $('#questions p').serializeArray();
        // now do something with $.ajax to submit the questions
        $.post("myphp.php",tab,function(resp){
          // what do I do with the server's reply ???
        });
      });
    });
  </script>
  <style type="text/css">
  </style>
</head>
<body>
  <textarea id='textarea'></textarea>
  <button type='button' id='textareabutton'>Add question</button>
  <div id='questions'></div>
  <button type='button' id='submit'>Submit questions</button>
</body>
</html>

Answer 2

使用div的innerHTML属性将问题添加到。

将数据动态添加到HTML页面

2 个答案: