gpt4 book ai didi

javascript - 从具有 anchor 和图像标签的输入更新列表的 html

转载 作者:行者123 更新时间:2023-12-02 21:10:16 25 4
gpt4 key购买 nike

我想要一个jquery代码,请检查脚本中的注释。afetr点击这里我想要代码,在li中添加inputText,其余相同我不知道为什么第一次发布问题会如此令人毛骨悚然?

<body>
<div class="content">
<div class="main">
<input type="text" autofocus placeholder="Please write your task here....">
<button>Click To Add</button>
</div>

<div class="data">enter code here
<ul>
<li>Item aided shown here <a id="del-button" href="https://www.google.com">
<img src="del.png" alt="delete-button"> </a> </li>
</ul>

</div>
</ class="content">

<script>
$('document').ready(function () {

var cont = $('.content');

$('button').click(function () {
var inputText = $('input');
var newList = $('li').first().clone();

// now afetr click here i want code, to add inputText in li and rest the same


})

})

</script>

</body>

最佳答案

试试这个:

 $('button').click(function () {
var inputText = $('input').val();
var newList = $('<li></li>');
newList.append(inputText);
newList.append('<a id="del-button" href="https://www.google.com"><img src="del.png" alt="delete-button"> </a>');
$("ul").append(newList);
});

另请注意,您的 HTML 代码在 <script> 之前已损坏。标签你有 </ class="content">而不是</div class="content"> .

工作中Fiddle .

关于javascript - 从具有 anchor 和图像标签的输入更新列表的 html,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61116519/

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