批量添加列表,并进行判断
来源:互联网 发布:淘宝宝贝照片拍摄 编辑:程序博客网 时间:2024/06/16 16:21
在写后台时,有时需要 “批量添加列表”,并且提交时判断,列表内容不能为空,例如:
html:
<div class="itemDiv" style="margin-bottom: 10px;"> <p> <label for="itemLists">道具列表</label> <select name="itemLists" id="itemLists" style="margin-left: 15px;"> <option value="item">道具</option> <option value="equipment">装备</option> </select> </p> <p> <label for="itemID">道具ID</label> <input type="text" name="itemID" class="itemID" id="itemID" style="margin-left: 28px;"> </p> <p> <label for="itemNumbers">道具数量</label> <input type="text" name="itemNumbers" class="itemNumbers" id="itemNumbers" style="margin-left: 15px;"> </p></div><p id="addP" style="margin-top: 10px;"> <button type="button" id="addItemBtn">添加奖品</button></p>
前端js 添加奖品 功能:
// 添加奖品 功能var addCount = 1;$(document).ready( $('#addItemBtn').click(function () { addCount++; if ( addCount > 4 ) { alert('不能超过4个!'); return false; } else { var $itemDiv = '<div class="itemDiv" style="margin-bottom: 10px;">' + '<p>' + '<label for="itemLists">道具列表</label>' + '<select name="itemLists" id="itemLists" style="margin-left: 15px;">' + '<option value="item">道具</option>' + '<option value="equipment">装备</option>' + '</select>' + '</p>' + '<p>' + '<label for="itemID">道具ID</label>' + '<input type="text" name="itemID" class="itemID" id="itemID" style="margin-left: 28px;">' + '</p>' + '<p>' + '<label for="itemNumbers">道具数量</label>' + '<input type="text" name="itemNumbers" class="itemNumbers" id="itemNumbers" style="margin-left: 15px;">' + '</p>' + '</div>'; $('#addP').before($itemDiv); } }));
前端js判断:
// 当 道具DIV 不是1个的时候,进行判断if ( $('.itemID').length > 1 ) {// 批量 添加道具 判断是否为空 var isItemIDNull = true; // 加个 第三方 $('.itemID').each(function () { if (!$(this).val()) { isItemIDNull = false; alert('道具ID不能为空!'); return false; } }); var isItemNumbersNull = true; $('.itemNumbers').each(function () { if (isItemIDNull) { // 如果 ID 通过验证了,再验证下面;否则会弹出2次提示! if (!$(this).val()) { isItemNumbersNull = false; alert('道具数量不能为空!'); return false; } } }); if (isItemIDNull == false || isItemNumbersNull == false) { // 最终给 click事件,返回一个结果 return false; }}
阅读全文
0 0
- 批量添加列表,并进行判断
- 提交进行判断并提示
- 利用存储过程进行批量数据添加
- 【MySQL】批量检查表并进行repair,optimize
- 批量添加用户并设置密码
- 图片移动并进行边界判断
- 判断浏览器版本并进行响应
- AngularJS排序+模糊查询+批量删除+添加列表
- Mybatis列表批量插入并反正插入主键
- Lua判断OS并添加cpath
- mongodb添加用户密码并进行配置
- 【Java】Java中判断进行数据库批量操作是否成功
- mysql批量插入随机数据并判断重复
- 如何用javascript控制checkbox,并进行批量删除
- ubuntu 查看文件编码并进行批量编码修改
- ubuntu 查看文件编码并进行批量编码修改
- ubuntu 查看文件编码并进行批量编码修改
- ubuntu 查看文件编码并进行批量编码修改
- 有关于application/x-www-form-urlencoded等字符编码的解释说明
- ViewPager制作滑动界面
- Android与H5互调使用cordova的WebView,插件调用,插件编写
- WaitableTimer的实例讲解
- JavaSE学习分享——面向对象初识1
- 批量添加列表,并进行判断
- CodeForces 356A
- 树的遍历(中序、先序、后续)
- 数据结构--图--最小生成树
- JavaScript判断移动端及pc端访问不同的网站
- mybatis的xml文件中列名和mysql数据库中的关键字冲突
- ZOJ 3447 Doraemon's Number Game(优先队列+高精度运算)
- 如何读写文本文件
- Cortex M3存储器映射