JQ实现简单的图书管理（增删）

最新推荐文章于 2022-11-20 23:42:24 发布

原创

最新推荐文章于 2022-11-20 23:42:24 发布 · 3.3k 阅读

16 ·

CC 4.0 BY-SA版权

文章标签：

#JQ

本文介绍如何使用JQuery（JQ）实现一个简单的图书管理功能，包括添加和删除图书的操作。通过一个没有实际服务器交互的表单展示，强调在实际开发中应使用form标签的专业性。内容中利用ul li结构展示图书列表，并用JQ的click方法与on()方法处理用户交互，特别是对于已添加图书的删除操作，使用on()确保对动态添加元素的支持。

要实现的就是这么一个简单的界面
在对话框中填入书名会添加在下面的列表中
点击列表中的删除键可以将所选项移除
如果不输入任何内容点击添加图书会弹出提醒
首先看到第一张，上半部分一个提交对话框，下面一个列表，通过“添加图书”这个按钮将两部分链接在一起。
首先是上半部分:

<label>请输入书名：</label> <input type="text">
    <p><button>添加图书</button> 当前有<span>3</span>本书</p>

这里虽然明显看就是一个表单，但是我没有写form，应为没有实际的页面与WEB服务器交互过程，但是在实际开发中应该是要写进去，这样比较专业；
然后是下半部分，有点基础的应该可以看出使用ul li写的，其实也可以用<div>，这里还是专业问题，虽然用<div>可以实现同样的效果，有可能比用ul li写的跟简单，但是最好还是用ul li写比较好，你想想，既然语言上有这个功