使用AJAX目标和更新动态创建的内容

Question

我试图创建一个用户可以回答现有问题的问题/答案系统。问题系统正确发布并显示到数据库，但我在回答动态创建的问题时遇到困难。

要保存在这里的空间是没有

$(document).ready(function() { 
//make sure it was the postReply button 
    $("#postReply").on("click", function(){ 
     //get the questionID the user just clicked on 
     var questionID=$(this).val(); 
     //hide the reply button 
     $("#postReply").hide(); 
     //show the reply framework 
     $('.reply').append('<div class="replycontent"><p><textarea name="answer" id="answer" placeholder="Enter your answer"></textarea></p><p><button id="postAnswer" type="submit">Post Answer</button></p></div>'); 
    }); 
}); 

一个循环内从该行调用代码：

echo '<p><button type="submit" id="postReply" value='.$questionID.'>Reply</button></p> '; 
echo '<div class="reply" id="reply'.$questionID.'">'; 

，我打的问题是，我更新和增加股利到每一个问题，因为.reply是不正确的目标。我似乎无法让它定位到被点击的问题ID。我试着用警报进行测试，但只有最近的问题按钮正在解析到脚本中。

我只能隐藏最近添加的评论按钮。

这是正在从SQL查询

<p>Question ID: 34 Title: z Description: zz Date Posted:2017-08-04 05:31:28</p> 
<p><button type="submit" id="postReply" value=34>Reply</button></p> 
<div class="reply" id="reply34"></div> 

创建时点击回复按钮对上述问题的代码应该看起来像HTML源代码的输出：

<p>Question ID: 34 Title: z Description: zz Date Posted:2017-08-04 05:31:28</p> 
<div class="reply" id="reply34"> 
    <div class="replycontent"> 
     <p><textarea name="answer" id="answer" placeholder="Enter your answer"></textarea></p> 
     <p><button id="postAnswer" type="submit">Post Answer</button></p> 
    </div> 
</div> 

Answer 1

我不确定是否真的明白了这个问题，但请尝试替换：

$('.reply').append('<div class="replycontent"><p><textarea name="answer" id="answer" placeholder="Enter your answer"></textarea></p><p><button id="postAnswer" type="submit">Post Answer</button></p></div>'); 

由此：

$('#reply' + questionID).append('<div class="replycontent"><p><textarea name="answer" id="answer" placeholder="Enter your answer"></textarea></p><p><button id="postAnswer" type="submit">Post Answer</button></p></div>'); 

您的字段有所有不同的ID属性，因此您可以使用它。

要隐藏您的按钮，因为它们具有相同的ID，您的选择器可能看起来像$('#postRelpy[value="' + questionID + '"]')。