Question

我有一个页面，用户可以在其中列出列表。他们通过在输入框中输入字符串，然后单击按钮以将该字符串添加为列表项来执行此操作。当我单击一个列表项时，如何更改这些列表项的类别以在文本中插入一行？或编辑列表项的内容？

我也尝试了$（'li'）。toggleClass（“ finishedItem”）而不是'p'，并且也没有改变，我不确定自己做错了什么，谢谢您。

$(document).ready(function () {
 addText();
 $('p').onclick = markComplete();
});
const $addBtn = $("#add");
const $newItemList = $('ul');
const $inputBox = $('input');

const addText = function () {
$addBtn.on("click", function () {
    addLI();
});
};
const addLI = function () {
if($inputBox.val()!=="")
{
    $newItemList.append("<li>" +"<p>"+ $inputBox.val() +"</p>" + " 
</li>");
}

};
const markComplete = function(){

$('p').toggleClass("finishedItem")

};

Answer 1

$(document).ready(function () {
 addText();

});
const $addBtn = $("#add");
const $newItemList = $('ul');
const $inputBox = $('input');

const addText = function () {
$addBtn.on("click", function () {
    addLI();
});
};
const addLI = function () {
if($inputBox.val()!=="")
{
    $newItemList.append("<li>" +"<p onclick=\"$(this).attr('class', 'finishedItem');\">"+ $inputBox.val() +"</p>" + " 
</li>");
}

};

将文本动态添加到列表后，如何更改文本（编辑其内容或其类）

1 个答案: