onclick ajax用php和html事件多次调用

Question

main php file named (add_question.php)

<?php
include 'config.php';
include 'header.php';
include 'session_out.php';
?>
<?php 
    if(isset($_SESSION['user_type']))
    {       
    if($_SESSION['user_type']=='Admin')
    {
    ?>
    <div class="main">
      <div class="main-content">
        <h1 class="pagetitle">Add Questions 
        <?php 
        $id=$_GET['sub'];
        $sub=mysql_query("SELECT * FROM subject WHERE id='$id'");
        while($row=mysql_fetch_array($sub))
        {
            echo "(".$row['subject'].")";
        } ?></h1>


        <button onclick="getmore();tot()">Add More</button><font color="#003333"> <- click here to add More Questions.</font>
        <h4>Total 
        <input type="text" id='tot_q' value="1" style="width:40px" readonly> Questions
        </h4>

        <form action="addq.php" method="post" name="user_add">
        <div class="column1-unit">
         <br/>
         <?php if(isset($_GET['wrnmsg1']))
                {
                    ?>
                    <h5 style="color:#FF0000">
                    <?php
                    echo $_GET['wrnmsg1'];
                    ?>
                    </h5>
                    <?php
                }
         ?>
          <?php if(isset($_GET['sucmsg']))
                {
                    ?>
                    <h5 style="color:#003333">
                    <?php
                    echo $_GET['sucmsg'];
                    ?>
                    </h5>
                    <?php
                }
         ?>
         <br/>
         <input type="hidden" name='sub' value="<?php echo $id;?>">
         <label>Question:</label><input type="text" name='question[]' style="width:150%" required>
         <br/>
          <br/>
          Ans 1:<input type="text" name='ans1[]' style="width:40%" required>
          Ans 2:<input type="text" name='ans2[]' style="width:40%" required>
          <br/> <br/>
          Ans 3:<input type="text" name='ans3[]' style="width:40%" required>
          Ans 4:<input type="text" name='ans4[]' style="width:40%" required>
        <br/>
        <br/>
        Currect Ans: <select name='c_ans[]' required>
                        <option value=""></option>
                        <option value="1">Ans 1</option>
                        <option value="2">Ans 2</option>
                        <option value="3">Ans 3</option>
                        <option value="4">Ans 4</option>                                                
                    </select>
         <br/>
         <br/>

          </div>
            <div class="column1-unit" id='morediv'>
            </div>
         <input type="submit" value="Add Questions" name='add_sub'>
         <script language="javascript" type="text/javascript">
        function getXMLHTTP()
        { //function to return the xml http object
                var xmlhttp=false;  
                try
                {
                    xmlhttp=new XMLHttpRequest();
                }
                catch(e)    
                {       
                    try
                    {           
                        xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
                    }
                    catch(e)
                    {
                        try
                        {
                            xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
                        }
                        catch(e1)
                        {
                            xmlhttp=false;
                        }
                    }
                }

                return xmlhttp;
        }
        function getmore() 
        {       
            var strURL="getmore_q.php";
            var req = getXMLHTTP();

            if (req) 
            {
                req.onreadystatechange = function()
                {
                    if (req.readyState == 4) 
                    {
                        if (req.status == 200) 
                        {                       
                            document.getElementById('morediv').innerHTML+=req.responseText;                     
                        }
                        else
                        {
                            alert("Problem while using XMLHTTP:\n" + req.statusText);
                        }
                    }               
                }           
                req.open("GET", strURL, true);
                req.send(null);
            }
            return false;

        }
        function tot()
        {
        var tot=document.getElementById("tot_q").value;
        tot=parseInt(1)+parseInt(tot);
        document.getElementById("tot_q").value=tot;

        }
        </script>

         </form>

         <br/>


        <hr class="clear-contentunit" />
      </div>
    </div>
<?php }
}
else
{
    ?>
    <script>
        window.location.assign('signin.php');
    </script>
    <?php
}
?>
</body>
</html>


ajax call file named(getmore_q.php)

         <br/>
         <label>Question:</label><input type="text" name='question[]' style="width:150%" required>
         <br/>
          <br/>
          Ans 1:<input type="text" name='ans1[]' style="width:40%" required>
          Ans 2:<input type="text" name='ans2[]' style="width:40%" required>
          <br/> <br/>
          Ans 3:<input type="text" name='ans3[]' style="width:40%" required>
          Ans 4:<input type="text" name='ans4[]' style="width:40%" required>
        <br/>
        <br/>
        Currect Ans: <select name='c_ans[]' required>
                        <option value=""></option>
                        <option value="1">Ans 1</option>
                        <option value="2">Ans 2</option>
                        <option value="3">Ans 3</option>
                        <option value="4">Ans 4</option>                                                
                    </select>
         <br/>
         <br/>
        <hr class="clear-contentunit" />

现在问题是我在ajax文件元素中输入文本，在下一次调用ajax file.ex时变为空白。 我添加5个问题的输入元素，我也把数据放在所有的文本框中但是如果我添加新的问题，最后一个ajax生成的文本框变为空。有什么方法可以解决这个问题？

Answer 1

问题是你有以下几行：

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

这会将“myDiv”中的文本重置为xmlhttp.responseText 。

如果您希望它显示“用户单击按钮的次数”，则必须使用：

document.getElementById("myDiv").innerHTML+=xmlhttp.responseText;

其中附加了“myDiv”的HTML。