时间戳

首页 > 解决方案 > 从具有锚点和图像标记的输入更新列表的 html

javascript - 从具有锚点和图像标记的输入更新列表的 html

问题描述

我想要一个 jquery 代码，请检查 script.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>

标签： javascriptjquerylist

解决方案

尝试这个：

 $('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">.

工作小提琴。

推荐阅读