之前一直在用JS实现列表删除前的数据验证,了解过JQ之后发现自己之前的代码好多都是多余的,真心觉得JQ的强大,强大的筛选机制,为了方便交流,也为了加深自己的印象,在这里将两者之间进行一个对比:
1.JS实现的验证:
思路:将制定控件中的子控件全部获取出来,然后逐个访问以筛选出复选框,并根据其选中状态给一个变量赋值,如果全部访问晚且未发现任何选中的项则表明用户未选择需要删除的项,此时直接在前台告诉用户操作出错;反之,若能发现选中了数据项,则询问用户确认删除后对数据进行删除
function Delete()
{
var mak=true;
//查找所有控件
var elem=window.form1.elements;
//开始循环访问控件
for(i=0;i<elem.length;i++)
{
//根据控件类型进行筛选
if(elem[i].type=="checkbox")
{
var chkName=elem[i].id;
if(chkName.indexOf("cbSelect")!=-1)
{
//判断选中状态
if(elem[i].checked==true)
{
mak = false;
break;
}
}
}
}
//如果未选中则向用户报错
if(mak==true)
{
alert("Please choose one")
return false
}
else
{
//向用户确认删除
var ks = window.confirm("Confirm Delete?");
if(!ks)
{
return false
}
}
return true
}
2.JQ的验证:
思路:具体思路其实跟JS一样,只不过强大的JQ帮我们完成了很多,比如需要用循环实现的筛选,比如判断等等,在JQ这里只需要加上你想筛选的条件即可,然后我们根据筛选出来的空间集合的长度便能知道用户是否选择过数据项
首先我们筛选出所有的input控件,然后根据ID进行筛选,只要ID是以cbSelect结尾的控件都满足要求,当然,这个条件可能只适用于我的例子,你还可以使用id^=**(id以**开头)、name!=***(name不以***开头)等等进行筛选,总之JQ能根据你的条件筛选出你要的结果。之前说到了筛选出列表中所有的复选框,最后的筛选便是找出那些被选中的项了。通过属性checked='checked'便能轻易获得那些控件,最后我们调用length获得这些控件的个数,如果是0,当然就说明用户未选中任意项了,一下的思路就跟JS一样了。
总之,JQ真的是非常方便的,有些事情只需要一个属性或一个函数就能轻松搞定,而且JQ还能与混用,因为JQ本身就是JS出来的!
function JS_Delete()
{
var count=$("input[id$='cbSelect'][checked='checked']").length
if(count==0)
{
alert('Please Select One');
return false;
}
else if(window.confirm("Continue to delete?")!=true)
{
return false;
}
else
return true;
}