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.'">';

我遇到的问题是我正在更新并将div添加到每个问题，因为.reply定位不正确。我似乎无法将其定位到被点击的questionID。我已尝试使用警报进行测试，但只有最新的问题按钮正在解析脚本。

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

这是从SQL查询

创建的HTML源的输出

<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>

单击上述问题的“回复”按钮时，代码应如下所示：

<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 + '"]')。

使用AJAX

1 个答案: