jquery实现在一个框中输入内容，点击添加后，在另外一个框中显示出来，且能删除

最新推荐文章于 2022-12-18 22:22:09 发布

原创

最新推荐文章于 2022-12-18 22:22:09 发布 · 3k 阅读

2 ·

CC 4.0 BY-SA版权

本文介绍了如何使用jQuery实现一个功能：在输入框中输入内容后，点击添加按钮，内容会显示在另一个展示框内，并提供删除功能。通过HTML和jQuery的示例代码，详细阐述了实现这一交互的过程。

html:

<table class="h-box">
            <tr>
                <td class="num1">
                   <span>台站名称:</span> 
                    <input type="text" id="t1"/>
                    <button id="tAdd" >添加</button>
                    <button id="tRemove">删除</button>
                </td>
                <td class="num2">
                    <span>报警名称:</span>
                    <input type="text" id="t2" />
                    <button id="bAdd">添加</button>
                    <button id="bRemove">删除</button>
                </td>
            </tr>
            <tr class="textarea">
                <td>
                    <span>名称列表:</span>
                    <ul type="text" id="t3">
                    </ul>
                </td>
                <td>
                    <span>报警列表:</span>
                    <ul type="text" id="t4"></ul>
                </td>
            </tr>
        </table>

css:

  body{
            background:url("../img/weixin.png") no-repeat;
            width:100%;
            heig

最低0.47元/天解锁文章