Question

通过jquery添加新元素时，如何在嵌套列表中定义具有特定名称或id的每个元素，具体取决于当前存在的内容？

示例：

问题1 答案1 答案2

添加答案

当我点击＆＃34;添加答案＆＃34;我想添加一个新的答案，但知道它是＆＃34; ans3＆＃34;。此外，将有多个顶级和嵌套列表，因此需要知道它与哪个问题相关联。

EX）

Question 1

Answer 1
Answer 2

Question 2

Answer 1
Answer 2

谢谢！

Answer 1

以下是两个javascript / jquery事实，在为此设计解决方案时对您有用。

事件回调绑定到执行时触发事件的对象。
DOM元素可以包含任意数量的data- *属性，用于携带数据。

因此，当用户点击问题进行回答时，点击回调可以访问问题this。此外，当您添加一个作为答案的新元素时，您可以设置一个＆＃34;数据问题＆＃34;属性，它指向问题的ID。如果你有这样的问题：

<li class="question" id="question1">
    <span>How to detect nested list id?</span>
    <input type="text" />
    <button class="send-answer" data-questionid="question1">Add Answer</button>
</li>

然后是一些像这样的JavaScript代码

$('.send-answer').click(function (e) {
    e.preventDefault();
    var questionId = $(this).attr('data-questionid');
    var answer = $('#' + questionId).find(input).val();
    var answerElement = $('<span>').text(answer).attr('data-questionid', questionId);
    $('#' + questionId).append(answerElement);
}

将为您提供所需的产品。还有一些方法可以解决这个问题，例如，不是向按钮添加data-questionid，而是可以搜索按钮的父级以查找包含类问题的li，并从该元素中获取id。 / p>

检测嵌套列表ID

1 个答案: