gpt4 book ai didi

javascript - 动态添加到列表后如何更改文本(编辑其内容或类)

转载 作者:行者123 更新时间:2023-11-30 19:27:10 25 4
gpt4 key购买 nike

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

我也尝试了 $('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")

};

最佳答案

$(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>");
}

};

关于javascript - 动态添加到列表后如何更改文本(编辑其内容或类),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56783763/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com