m0_73895993 2022-12-01 03:50 采纳率: 100%
浏览 25
已结题

如何读取input中输入的值,并通过button将其填入无序列表ul中

利用js,实现一个动态列表。主要功能为:一个input输入框,一个button,下面是一个ul无序列
表(起初没有内容)。按一次button,可以将输入框里的内容填入无序列表的第一行,同时input内容清
空。如果input输入框内容为空字符串,则无操作。再按一次button,可以将输入框填入第二行,依次类
推。可以尝试增加对应行的删除按钮等。

  • 写回答

1条回答 默认 最新

  • orbitgw 新星创作者: C/C++技术领域 2022-12-01 08:10
    关注

    要用到jQuery

    <ul>
    <li>List item 1</li>
    <li>List item 2</li>
    <li>List item 3</li>
    </ul>
    <input type="text" id="input-box">
    <button onclick="handle()"></button>
    <script>
    function handle(){
        var content = document.getElementById('input-box').value;
        if(content != ""){
            $("ul").append("<li>"+content"</li>");
        }
       document.getElementById('input-box').value = ""
    }
    <script>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 系统已结题 3月8日
  • 已采纳回答 2月28日
  • 创建了问题 12月1日