Web 界面
Checkbox不选择时赋值的实现(非选中状态赋值)
2010-11-10, Nortan Posted in Java, Web 界面 | 1 回复 | 查看全文>>
Checkbox在不选择时,并不会向服务器发送false值(或者off值),甚至连这个的参数名都不会向服务器端发送,所以通常我们判断取到的值为null,就认为用户没有选择,并给他的值设置为false,但一些情况下,我们可能不是手工来取这个值,而是写了一个统一的函数,直接把所有的参数转成FormBean,在这种情况下,取不到值的情况我们不一定都设置为false,因为还有可能本来就是取NULL的情况,所以如果checkbox 没有传递参数过来,我们也要想办法设置他的值为false.
在Spring的框架中,同样存在这样的问题,他的解决办法是为每一个Checkbox生成一个隐藏域,当用户没有选择checkbox时,也会向服务器端发送按一定规则命名的隐藏域,从而来表达用户没有选择这个控制的事实。
本次项目的框架是自己写的,出于更简单的原则,在做页面时,不为checkbox设置隐藏域,而是在提交过程中,动态为没有选择的checkbox生成隐藏域,这样页面上会更简洁。出于这个思想,用Jquery实现了一个插件,用来为没有选中的checkbox 传递false值给服务器端。代码如下:
jQuery.fangdo = { //forms_selector: form的选择器 checkboxField : function(forms_selector){ $(forms_selector).each(function(){ var cur_form = $(this); cur_form.submit(function(){ $(this).find(":checkbox").each(function(i){ if(!$(this).attr("checked")){ cur_form.append("<input type='hidden' value='off' name='"+ $(this).attr('name') +"'></input>"); } }); }); }); } };
使用的方式主要有如下两种:
$(function(){ //第一种,引用Form表单的id,注意,这里是id,不是name值 $.fangdo.checkboxField("#registerForm"); //第二种,引用所有Form表单,这种情况用于有多个Form都要设置checkbox在非选中状态生成隐藏域 $.fangdo.checkboxField("Form"); });
如果你有更好的方法,请共享出来,大家一起分享
Google analytics脚本异步加载,加快访问速度
2010-07-26, Nortan Posted in Web 界面, 一起分享, 常用 | 1 回复 | 查看全文>>
Google analytics本身提供的脚本都是在页面全部加载完成后才会执行,如果网络情况不太好,这不仅影响统计,也会影响到访问速度,所以使用Google analytics,最完美的办法就是实现脚本异步加载,来加快页面访问速度。如果你现在还在使用google analytics,可以用如下代码替代原来的统计代码,实现异步统计:
var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-XXXXX-X']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; ga.setAttribute('async', 'true'); document.documentElement.firstChild.appendChild(ga); })();
很明显,需要把UA-XXXXX-X替换成你的ID就成了。
一个简单的Ajax封装类
2010-07-01, Nortan Posted in Web 界面, 常用 | 2 回复 | 查看全文>>
在一些小项目中,可能没有使用Jquery这样的js框架,但需要一些js常用的功能,如ajax请求,邮件校验,字符串去空格等,这里封装了一个ajax请求类,在小项目中比较适用.后面给出了一个使用例子. 查看全文…
Jquery常用学习文档及资料
2010-03-31, Nortan Posted in Web 界面 | 我来说两句 | 查看全文>>
ExtJS很漂亮也很强大,但我觉得它因受UI制约,在某些场合用起来并不灵活,相对Extjs,Jquery是一个相对小巧,功能更强大,使用更灵活的js框架,而且JQuery还有数不清的插件可以使用。这个文章主要收集常用的学习文档及其它关于Jquery的资料地址链接,并随时进行更新维护。
1、jQuery中文入门指南,翻译加实例,jQuery的起点教程
http://www.k99k.com/jQuery_getting_started.html
2、jQueryAPI参考文档中文版翻译下载地址
http://code.google.com/p/jquery-api-zh-cn/downloads/list
3、 jQuery从入门到晋级教程,这个教程有例子,比较容易懂
http://www.jzxue.com/special/jQuerycongrumendaojinjijiaocheng_2100.html
用JQuery仿淘宝首页的图片滚动展现
2010-03-24, Nortan Posted in Web 界面 | 6 回复 | 查看全文>>
用Jquery来以滚动的形式展现图片,需要三个步骤,第一个步骤就是把所展现的图片用<li>标签来列举,并列举每个图片对应的序号,第二步使用CSS来控制图片及序号的样式,相对图片来说,主要控制展现图片位的大小,相对序号来讲,除了定位外,还要考虑到当然展现的图片的序号高亮显示。第三步是使用Jquery来控制图片定时滚动切换。下面对这三步进行详细说明
第一步,展现图片内容的html代码为,注意<li class=”on”>1</li>这里的on表示载入后,第一个图片为展现状态 查看全文…
