所有html元素中select算是比较坑爹的一个。他让人抓狂的地方主要是: 不同的浏览器显示的默认下拉框样子不完全相同 IE下无法手动设置select的高度(这是最坑爹的!),只能靠font-size撑起来 select右侧的下拉箭头是无法使用背景消除的,这就导致无法使用css进行美化 总结起来,解决办法主要有: 将select隐藏掉,而使用div进行模拟 将select透明度设置为0,然后使用相对定位在下方加一个长得很像select又美化了的div 隐藏方案一般原理如下: 找到页面需要处理的select,将其隐藏 根据select的option,创建一个li列表(当然也可以是div),并隐藏。 在select的位置创建一个div,显示select的值(selected的option)。并使用css对其进行美化,使其看起来像一个select 添加事件,使点击“select”的时候,显示li列表。并使用相对定位,让这个列表显示在“select”下方 对li列表添加事件,模拟下拉框的选值过程(点击事件和键盘↑↓事件都要模拟) 选值完成后,要将选的值显示到上方的“select”,并设置真正的select的值 当然,如果你想做的更复杂点,还可以添加选项搜索、多选、多选后的选项删除等。当时一般原理都跟上面差不多。网上也有很多这样的插件。
大家知道Jquery中有serialize方法,可以将表单序列化为一个“&”连接的字符串,但却没有提供序列化为Json的方法。不过,我们可以写一个插件实现。 我在网上看到有人用替换的方法,先用serialize序列化后,将&替换成: 、‘: /** * 重置form表单 * @param formId form的id */ function resetQuery(formId){ var fid = "#" + formId; var str = $(fid).serialize(); //str= cardSelectDate=3&startdate=2012-02-01&enddate=2012-02-04 var ob= strToObj(str); alert(ob.startdate);//2012-02-01 } function strToObj(str){ str = str.replace(/&
error 通常用来处理图像无法加载的错误。 $("img").error(function(){ $(this).hide(); }); $(document).ready(function(){ $("img").error(function() { this.src="/static/img/tempImg.jpg"; }); }); 测试发现虽然 页面显示 图片加载失败 但是 src并没有指向 "/static/img/tempImg.jpg",并且没有触发这个事件。在网上找了一圈儿 也没有找到原因。 好吧,只好做了如下处理: $(document).ready(function(){ $("img").error(function() { this.src="/static/img/tempImg.jpg"; }); //测试发现在对onError事件或者说对jQuery绑定的error事件处理时,将该事件处理脚本放在ready函数中执行时根本不起作用。所以这里手动触发 error事件 $("img"