Below you will find pages that utilize the taxonomy term “JQuery”
April 23, 2013
开发jquery插件
"\u003cp\u003ejquery插件开发文档:\u003c/p\u003e\n\u003cp\u003e以下为一简单的实例:\u003c/p\u003e\n\u003cp\u003e\u003cstrong\u003echajia.js:\u003c/strong\u003e\u003c/p\u003e\n\u003cdiv class=\"highlight\"\u003e\u003cpre tabindex=\"0\" style=\"color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;\"\u003e\u003ccode class=\"language-js\" data-lang=\"js\"\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e(\u003cspan style=\"color:#66d9ef\"\u003efunction\u003c/span\u003e(\u003cspan style=\"color:#a6e22e\"\u003e$\u003c/span\u003e) {\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#75715e\"\u003e//录入框点击事件\n\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#75715e\"\u003e\u003c/span\u003e\u003cspan style=\"color:#a6e22e\"\u003e$\u003c/span\u003e.\u003cspan style=\"color:#a6e22e\"\u003efn\u003c/span\u003e.\u003cspan style=\"color:#a6e22e\"\u003ealertWhileClick\u003c/span\u003e \u003cspan style=\"color:#f92672\"\u003e=\u003c/span\u003e \u003cspan style=\"color:#66d9ef\"\u003efunction\u003c/span\u003e() {\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#a6e22e\"\u003e$\u003c/span\u003e(\u003cspan style=\"color:#66d9ef\"\u003ethis\u003c/span\u003e).\u003cspan style=\"color:#a6e22e\"\u003eclick\u003c/span\u003e(\u003cspan style=\"color:#66d9ef\"\u003efunction\u003c/span\u003e(){\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003ewindow.\u003cspan style=\"color:#a6e22e\"\u003econsole\u003c/span\u003e.\u003cspan style=\"color:#a6e22e\"\u003elog\u003c/span\u003e(\u003cspan style=\"color:#960050;background-color:#1e0010\"\u003e‘\u003c/span\u003e\u003cspan style=\"color:#a6e22e\"\u003eexecute\u003c/span\u003e \u003cspan style=\"color:#a6e22e\"\u003eclick\u003c/span\u003e \u003cspan style=\"color:#a6e22e\"\u003eevent\u003c/span\u003e\u003cspan style=\"color:#960050;background-color:#1e0010\"\u003e’\u003c/span\u003e);\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#a6e22e\"\u003ealert\u003c/span\u003e(\u003cspan style=\"color:#a6e22e\"\u003e$\u003c/span\u003e(\u003cspan style=\"color:#66d9ef\"\u003ethis\u003c/span\u003e).\u003cspan style=\"color:#a6e22e\"\u003eval\u003c/span\u003e());\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e});\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003ewindow.\u003cspan style=\"color:#a6e22e\"\u003econsole\u003c/span\u003e.\u003cspan style=\"color:#a6e22e\"\u003elog\u003c/span\u003e(\u003cspan style=\"color:#960050;background-color:#1e0010\"\u003e‘\u003c/span\u003e\u003cspan style=\"color:#a6e22e\"\u003eok2\u003c/span\u003e\u003cspan style=\"color:#960050;background-color:#1e0010\"\u003e’\u003c/span\u003e);\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e}\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#75715e\"\u003e//获取页面最大div的最大高度\n\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#75715e\"\u003e\u003c/span\u003e\u003cspan style=\"color:#a6e22e\"\u003e$\u003c/span\u003e.\u003cspan style=\"color:#a6e22e\"\u003efn\u003c/span\u003e.\u003cspan style=\"color:#a6e22e\"\u003emaxHeight\u003c/span\u003e \u003cspan style=\"color:#f92672\"\u003e=\u003c/span\u003e \u003cspan style=\"color:#66d9ef\"\u003efunction\u003c/span\u003e(){\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#66d9ef\"\u003evar\u003c/span\u003e \u003cspan style=\"color:#a6e22e\"\u003emax\u003c/span\u003e \u003cspan style=\"color:#f92672\"\u003e=\u003c/span\u003e \u003cspan style=\"color:#ae81ff\"\u003e0\u003c/span\u003e;\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#66d9ef\"\u003ethis\u003c/span\u003e.\u003cspan style=\"color:#a6e22e\"\u003eeach\u003c/span\u003e(\u003cspan style=\"color:#66d9ef\"\u003efunction\u003c/span\u003e(){\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003ewindow.\u003cspan style=\"color:#a6e22e\"\u003econsole\u003c/span\u003e.\u003cspan style=\"color:#a6e22e\"\u003elog\u003c/span\u003e(\u003cspan style=\"color:#960050;background-color:#1e0010\"\u003e‘\u003c/span\u003e\u003cspan style=\"color:#a6e22e\"\u003ea\u003c/span\u003e\u003cspan style=\"color:#960050;background-color:#1e0010\"\u003e’\u003c/span\u003e);\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#a6e22e\"\u003emax\u003c/span\u003e \u003cspan style=\"color:#f92672\"\u003e=\u003c/span\u003e Math.\u003cspan style=\"color:#a6e22e\"\u003emax\u003c/span\u003e(\u003cspan style=\"color:#a6e22e\"\u003emax\u003c/span\u003e, \u003cspan style=\"color:#a6e22e\"\u003e$\u003c/span\u003e(\u003cspan style=\"color:#66d9ef\"\u003ethis\u003c/span\u003e).\u003cspan style=\"color:#a6e22e\"\u003eheight\u003c/span\u003e());\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e});\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#66d9ef\"\u003ereturn\u003c/span\u003e \u003cspan style=\"color:#a6e22e\"\u003emax\u003c/span\u003e;\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e}\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e})(\u003cspan style=\"color:#a6e22e\"\u003ejQuery\u003c/span\u003e);\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#75715e\"\u003e//插件用法\n\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#75715e\"\u003e\u003c/span\u003e\u003cspan style=\"color:#a6e22e\"\u003e$\u003c/span\u003e(\u003cspan style=\"color:#66d9ef\"\u003efunction\u003c/span\u003e(){\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#a6e22e\"\u003e$\u003c/span\u003e(\u003cspan style=\"color:#960050;background-color:#1e0010\"\u003e‘#\u003c/span\u003e\u003cspan style=\"color:#a6e22e\"\u003elogin_username\u003c/span\u003e\u003cspan style=\"color:#960050;background-color:#1e0010\"\u003e’\u003c/span\u003e).\u003cspan style=\"color:#a6e22e\"\u003ealertWhileClick\u003c/span\u003e();\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\n\u003c/span\u003e\u003c/span\u003e\u003cspan style=\"display:flex;\"\u003e\u003cspan\u003e\u003cspan style=\"color:#66d9ef\"\u003evar\u003c/span\u003e \u003cspan style=\"color:#a6e22e\"\u003etallest\u003c/span\u003e \u003cspan style=\"color:#f92672\"\u003e=\u003c/span\u003e \u003cspan style=\"color:#a6e22e\"\u003e$\u003c/span\u003e(\u003cspan style=\"color:#960050;background-color:#1e0010\"\u003e‘\u003c/span\u003e\u003cspan style=\"color:#a6e22e\"\u003ediv\u003c/span\u003e\u003cspan style=\"color:#960050;background-color:#1e0010\"\u003e’\u003c/span\u003e).\u003cspan style=\"color:#a6e22e\"\u003emaxHeight\u003c/span\u003e(); …\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/div\u003e"
November 19, 2012
Ajax getjson 跨域通信 php+jquery
"\u003cp\u003e\u003cstrong\u003e网站A的表单提交部分:\u003c/strong\u003e\u003c/p\u003e\n\u003cp\u003e\u003cstrong\u003e网站B的输出json部分:\u003c/strong\u003e\u003c/p\u003e\n\u003cp\u003e$_GET[‘jsoncallback’] . ‘(‘ . json_encode($return) . ‘)‘);\u003c/p\u003e\n\u003cp\u003e?\u0026gt;\u003c/p\u003e"
November 5, 2012
jquery中validate插件和form插件冲突的解决办法
"\u003cp\u003e如题:用jquery form提交表单,用jquery validate做数据验证 ,现在的问题是分别使用validate有作用,一起使用,则validate不起作用,谁遇到过帮忙解决下。\u003c/p\u003e\n\u003col start=\"2\"\u003e\n\u003cli\u003e\n\u003cp\u003e $(document).ready(function() {\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e $(“#inputForm”).validate({\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e …\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e });\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e });\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e function onsubmit(){\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e var options ={\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e …\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e };\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e $(‘#inputForm’).ajaxSubmit(options); //options\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e return false;\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e }\u003c/p\u003e\n\u003c/li\u003e\n\u003c/ol\u003e\n\u003cp\u003e==================\u003c/p\u003e\n\u003cp\u003e补充一下,这个submitHandler:function(){}方法内可以写任何方法。但最后要有一个form.submit或form.ajaxSubmit\n比如我这个\u003c/p\u003e\n\u003col\u003e\n\u003cli\u003e\n\u003cp\u003e$(document).ready(function(){ …\u003c/p\u003e\u003c/li\u003e\u003c/ol\u003e"
August 5, 2012
jQuery Datepicker 中文
"\u003cp\u003e\u003ca href=\"http://blog.haohtml.com/wp-content/uploads/2012/08/jquery-ui-datepicker-chinese.png\"\u003e\u003cimg src=\"http://blog.haohtml.com/wp-content/uploads/2012/08/jquery-ui-datepicker-chinese.png\" alt=\"\"\u003e\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e以前在使用 js 日历时,没有使用过 \u003ca href=\"http://jqueryui.com/demos/datepicker/\"\u003ejQuery Datepicker\u003c/a\u003e,今天第一次使用发现非常的好用。使用时需要将日历文字显示为中文,打开前边的链接在文章底部就可以看到将 jQuery Datepicker 文字显示为中文的方法,在 \u003ca href=\"http://jquery-ui.googlecode.com/svn/trunk/ui/i18n/\"\u003ehttp://jquery-ui.googlecode.com/svn/trunk/ui/i18n/\u003c/a\u003e 可以看到各种版本的语言,中文文件内容如下:\u003c/p\u003e\n\u003cpre tabindex=\"0\"\u003e\u003ccode\u003ejQuery(function($){\n $.datepicker.regional[\u0026#39;zh-CN\u0026#39;] = {\n closeText: \u0026#39;关闭\u0026#39;,\n prevText: \u0026#39;\u0026lt;上月\u0026#39;,\n nextText: \u0026#39;下月\u0026gt;\u0026#39;,\n currentText: \u0026#39;今天\u0026#39;,\n monthNames: [\u0026#39;一月\u0026#39;,\u0026#39;二月\u0026#39;,\u0026#39;三 …\u003c/code\u003e\u003c/pre\u003e"
August 5, 2012
jQuery mouseover mouseout事件在IE下闪烁的解决方法
"\u003cblockquote\u003e\n\u003c/blockquote\u003e\n\u003cpre tabindex=\"0\"\u003e\u003ccode\u003e$(\u0026#34;#category ul\u0026#34;).find(\u0026#34;li\u0026#34;).each(\n function() {\n $(this).mouseover(\n function() {\n $(\u0026#34;#\u0026#34; + this.id + \u0026#34;_menu\u0026#34;).show();\n $(this).addClass(\u0026#34;a\u0026#34;);\n }\n );\n $(this).mouseout(\n function() {\n $(this).removeClass(\u0026#34;a\u0026#34;);\n $(\u0026#34;#\u0026#34; + this.id + \u0026#34;_menu\u0026#34;).hide();\n }\n );\n }\n);\n\u003c/code\u003e\u003c/pre\u003e\u003cp\u003e浏览器之间的不兼容一直令前端开发者的头疼,而 IE 更是噩梦。鼠标在下拉菜 …\u003c/p\u003e"
April 23, 2012
jquery.validate remote 和 自定义验证方法
"\u003cp\u003e$(function(){\u003c/p\u003e\n\u003cp\u003evar validator = $(“#enterRegForm”).validate({\ndebug:false, //调试模式取消submit的默认提交功能\n//errorClass: “error”,//默认为错误的样式类为:error\n//validClass: “check”,//验证成功后的样式,默认字符串valid\nfocusInvalid: true,//表单提交时,焦点会指向第一个没有通过验证的域\n//focusCleanup:true;//焦点指向错误域时,隐藏错误信息,不可与focusInvalid一起使用!\nonkeyup: true,\nerrorElement: “div”,\nsubmitHandler: function(form){ //表单提交句柄,为一回调函数,带一个参数:form\nform.submit(); //提交表单\n},\u003c/p\u003e\n\u003cp\u003erules: {\n“enterprise.enName”: {\nrequired: true,\nminlength: 6,\nremote:{\nurl: “/nameServlet”, // …\u003c/p\u003e"
May 30, 2011
weebox is a dialog plugin
"\u003cp\u003e使用前需包含以下jquery.js、bgiframe.js、weebox.js、wee.css文件\u003c/p\u003e\n\u003cp\u003e基本用法举例如下:\n$.weeboxs.open(‘#testbox’, {title: ‘hello world’, width:400, height: 200});\u003c/p\u003e\n\u003cp\u003e$.weeboxs.open(‘The operation failed.’,{\nonopen:function(){alert(‘opened!’);},\nonclose:function(){alert(‘closed!’);}, onok:function(){alert(‘ok’);\n$.weeboxs.close();} });\u003c/p\u003e\n\u003cp\u003e$.weeboxs.open(‘/modules/test/testsession.php’, {contentType:’ajax’});\u003c/p\u003e\n\u003cp\u003e$.weeboxs.open(‘hello world’);\u003c/p\u003e\n\u003cp\u003e$.weeboxs.open(‘The operation failed.’,{type:’error’});\u003c/p\u003e\n\u003cp\u003e$.weeboxs.open(‘The operation …\u003c/p\u003e"
April 18, 2011
自定义jquery validate 插件的默认提示语
"\u003cp\u003e\u003cstrong\u003e法一:\u003c/strong\u003e\u003c/p\u003e\n\u003cp\u003e一、默认校验规则\n(1)required:true 必输字段\n(2)remote:”check.php” 使用ajax方法调用check.php验证输入值\n(3)email:true 必须输入正确格式的电子邮件\n(4)url:true 必须输入正确格式的网址\n(5)date:true 必须输入正确格式的日期\n(6)dateISO:true 必须输入正确格式的日期(ISO),例如:2009-06-23,1998/01/22 只验证格式,不验证有效性\n(7)number:true 必须输入合法的数字(负数,小数)\n(8)digits:true 必须输入整数\n(9)creditcard: 必须输入合法的信用卡号\n(10)equalTo:”#field” 输入值必须和#field相同\n(11)accept: 输入拥有合法后缀名的字符串(上传文件的后缀)\n(12)maxlength:5 输入长度最多是5的字符串(汉字算一个字符)\n(13)minlength:10 输入长度最小是10的字符串(汉字算一个字符)\n(14)rangelength:[5,10] 输入长度必须介于 5 和 10 之 …\u003c/p\u003e"
April 18, 2011
jquery Form 验证 validate插件使用
"\u003cp\u003e不过我们还要在需要验证的INPUT里面class加入required说明是必填项,其他的就是验证相关数据比如email就是验证email的数据结构\u003c/p\u003e\n\u003cp\u003e以下列出validate自带的默认验证\u003c/p\u003e\n\u003cblockquote\u003e\n\u003cp\u003erequired: “必选字段”,\u003c/p\u003e\n\u003cp\u003eremote: check.php “使用ajax方法调用check.php验证输入值段”,\u003c/p\u003e\n\u003cp\u003eemail: “请输入正确格式的电子邮件”,\u003c/p\u003e\n\u003cp\u003eurl: “请输入合法的网址”,\u003c/p\u003e\n\u003cp\u003edate: “请输入合法的日期”,\u003c/p\u003e\n\u003cp\u003edateISO: “请输入合法的日期 (ISO).”,\u003c/p\u003e\n\u003cp\u003enumber: “请输入合法的数字”,\u003c/p\u003e\n\u003cp\u003edigits: “只能输入整数”,\u003c/p\u003e\n\u003cp\u003ecreditcard: “请输入合法的信用卡号”,\u003c/p\u003e\n\u003cp\u003eequalTo: “请再次输入相同的值”,\u003c/p\u003e\n\u003cp\u003eaccept: “请输入拥有合法后缀名的字符串”,\u003c/p\u003e\n\u003cp\u003emaxlength: jQuery.format(“请输入一个长度最多是 {0} 的字符串”),\u003c/p\u003e\n\u003cp\u003eminlength: jQuery.format(“请输入一个长度最少是 {0} 的字符串”),\u003c/p\u003e\n\u003cp\u003erangelength: jQuery.format(“请输入一个长度介于 {0} …\u003c/p\u003e\u003c/blockquote\u003e"
November 22, 2010
延迟加载图片的 jQuery 插件:Lazy Load
"\u003cp\u003e网站的速度非常重要,现在有很多网站优化的工具,如 Google 的 \u003ca href=\"http://fairyfish.net/2009/06/08/google-page-speed/\"\u003ePage Speed\u003c/a\u003e,Yahoo 的 YSlow,对于网页图片,Yahoo 还提供 \u003ca href=\"http://fairyfish.net/2009/12/14/smush-it/\"\u003eSmush.it\u003c/a\u003e 这个工具对图片进行批量压缩,但是对于图片非常多的网站,载入网页还是需要比较长的时间,这个时候我们可以使用 Lazy Load 这个 jQuery 插件来延迟加载图片。\u003c/p\u003e\n\u003cp\u003eLazy loader 是一个延迟加载图片的 jQuery 插件,在一些图片非常多的网站中非常有用,在在浏览器可视区域外的图片不会被载入,直到用户将页面滚动到它们所在的位置才加载,这样对于含有很多图片的比 较长的网页来说,可以加载的更快,并且还能节省服务器带宽。\u003c/p\u003e\n\u003cp\u003eLazy Loader 使用也非常简单,首先确保你的页面已经加载 jQuery Javascript 库,然后在加载 Lazy Load 的 Javascript 文件:\u003c/p\u003e\n\u003cblockquote\u003e\n\u003c/blockquote\u003e\n\u003cpre tabindex=\"0\"\u003e\u003ccode\u003e\u0026lt;script src=\u0026#34;jquery.js\u0026#34; type=\u0026#34;text/javascript\u0026#34;\u0026gt;\u0026lt;/script\u0026gt;\n\u0026lt;script …\u003c/code\u003e\u003c/pre\u003e"
November 2, 2009
12款Javascript表格控件(DataGrid)
"\u003cp\u003e\u003cstrong\u003e12款 \u003ca href=\"http://paranimage.com/category/dede/javascript/\"\u003eJavaScript\u003c/a\u003e 表格控件\u003c/strong\u003e。 表格控件(DataGrid )允许最终用户阅读和写入到绝大多数数据库的应用程序。DataGrid 控件可以在设计时快速进行配置,只需少量代码或无需代码。当在设计时设置了DataGrid 控件的 DataSource 属性后,就会用数据源的记录集来自动填充该控件,以及自动设置该控件的列标头。然后您就可以编辑该网格的列;删除、重新安排、添加列标头、或者调整任意一 列的宽度。\u003c/p\u003e\n\u003ch4 id=\"1-flexigrid\"\u003e1. \u003ca href=\"http://www.flexigrid.info/\"\u003eFlexigrid\u003c/a\u003e\u003c/h4\u003e\n\u003cp\u003e\u003ca href=\"/wp-content/uploads/2009/11/flexigrid.jpg\"\u003e\u003cimg src=\"https://blogstatic.haohtml.com//uploads/2023/09/flexigrid.jpg\" alt=\"flexigrid\"\u003e\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003eFlexigrid是一个类似于Ext Gird,但基于jQuery开发的Grid。它具有的功能包括:可以调整列宽,合并列标题,分页,排序,显示/隐藏表格等。Flexigrid显示的数据能够通过Ajax获取或者从一个普通的表格转换。\u003c/p\u003e\n\u003ch4 id=\"2-yahoo-ui-library-datatable--演示地址\"\u003e2. \u003ca href=\"http://developer.yahoo.com/yui/datatable/\"\u003eYahoo! UI Library: DataTable\u003c/a\u003e ( \u003ca href=\"http://developer.yahoo.com/yui/examples/datatable/index.html\"\u003e演示地址\u003c/a\u003e)\u003c/h4\u003e\n\u003cp\u003e\u003ca href=\"/wp-content/uploads/2009/11/yahoo-ui-libray-datetable.jpg\"\u003e\u003cimg src=\"https://blogstatic.haohtml.com//uploads/2023/09/yahoo-ui-libray-datetable.jpg\" alt=\"yahoo-ui-libray-datetable\"\u003e\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e该DataTable控件提供的功能有:排序、列宽调整、分页、inline editing、row selection等。\u003c/p\u003e\n\u003ch4 id=\"3-jqgrid\"\u003e3. \u003ca href=\"http://www.trirand.com/blog/\"\u003ejqGrid\u003c/a\u003e\u003c/h4\u003e\n\u003cp\u003e\u003ca href=\"/wp-content/uploads/2009/11/jqgrid.jpg\"\u003e\u003cimg src=\"https://blogstatic.haohtml.com//uploads/2023/09/jqgrid.jpg\" alt=\"jqgrid\"\u003e\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003ejqGrid是一个Ajaxed jQuery Grid插件。提供分页功能,添加、编辑、删除和搜索表 …\u003c/p\u003e"
October 12, 2009
jQuery+PHP实现FCKEditor内容分页
"\u003cp\u003e如题,用jQuery+PHP实现FCKEditor内容分页,如下:\u003c/p\u003e\n\u003cp\u003ePHP分页函数:\n/*\u003cstrong\u003e****\u003cem\u003e*\\\u003c/em\u003e*FCKEditor分页处理***\u003c/strong\u003e****/\nfunction pageBreak($content)\n{\n//把文章内容按照\u003c/p\u003e\n\u003cp\u003e分割成数组\n$content = $content;\n$pattern = “/\u003c/p\u003e\n\u003cp\u003e\u0026lt;/span\u0026gt;\u0026lt;/div\u0026gt;/”;\n$strSplit = preg_split($pattern, $content, -1, PREG_SPLIT_NO_EMPTY); //将文章内容分割成数组\n$count = count($strSplit); //分割后的数组单元数目\n$outStr = “”; //返回的字串\n$i = 1;\u003c/p\u003e\n\u003cp\u003eif ($count \u0026gt; 1 ) {\n$outStr = “\n”;\nforeach($strSplit as $value) {\nif ($i \u0026lt;= 1) {\n$outStr .= “\u003c/p\u003e\n\u003cp\u003e$value\u003c/p\u003e\n\u003cp\u003e”;\n} else {\n$outStr .= “\u003c/p\u003e\n\u003cp\u003e$value\u003c/p\u003e\n\u003cp\u003e”;\n} …\u003c/p\u003e"
June 7, 2009
jQuery/Ajax/PHP/Json 的一个综合例子
"\u003cp\u003ejQuery 是一个优秀的 Javascript 框架,对 js 进行了优秀的包装,提供了许多方便的功能。jQuery 对 ajax 的包装也堪称优秀。\u003c/p\u003e\n\u003cp\u003ejQuery 可以以 json 文件传输协议来传输数据(类似 xml,而且大有取代 xml 的趋势),而网站后台代码必须与之配合使用。PHP 是用 json_encode 函数来对返回的数组数据进行编码的,但这个函数只有 PHP5.2版本以上才支持。\u003c/p\u003e\n\u003cp\u003e从网上找到一个 json 的操作类,本人在 PHP4.4.7 版本下测试通过。本人还建了个函数 function my_json_encode($phparr),使代码兼容 PHP5.2 以上版本。\u003c/p\u003e\n\u003cp\u003e示例代码(包括 json 的类包软件)可以在以下网址下载:\u003c/p\u003e\n\u003cp\u003e以下是全部代码:\u003c/p\u003e\n\u003cp\u003ejQuery Ajax 实例演示\u003c/p\u003e\n\u003cp\u003e输入姓名:\u003c/p\u003e\n\u003cp\u003e输入年龄:\u003c/p\u003e\n\u003cp\u003e输入性别:\u003c/p\u003e\n\u003cp\u003e输入工作:\u003c/p\u003e\n\u003cp\u003e提交POST提交GET提交\u003c/p\u003e\n\u003cp\u003ePHP 文件 ajax_json.php:\u003c/p\u003e\n\u003cp\u003eencode($phparr);\n}\n}\n?\u0026gt;\u003c/p\u003e"
June 3, 2009
jquery 轻松实现 双击编辑文本框
"\u003cpre tabindex=\"0\"\u003e\u003ccode\u003e\u0026lt;script type=\u0026#34;text/javascript\u0026#34;\u0026gt;\n$(document).ready(function(){\n\t$(\u0026#34;.update\u0026#34;).dblclick(function(){\n\t\tid = $(this).attr(\u0026#39;id\u0026#39;);\n\t\ttext = $(this).text();\n\t\t\tif(text){\n\t\t\t$(this).html(\u0026#34;\u0026lt;input type=\u0026#39;text\u0026#39; size=12 name=\u0026#34;+id+\u0026#34; value=\u0026#34;+text+\u0026#34;\u0026gt;\u0026#34;);\n\t\t\t$(\u0026#34;.update \u0026gt; input\u0026#34;).focus().blur(function(){\n\t\t\t\t$.ajax({\n\t\t\t\t type: \u0026#34;POST\u0026#34;,\n\t\t\t\t url: \u0026#34;/data/dbedit\u0026#34;,\n\t\t\t\t data: …\u003c/code\u003e\u003c/pre\u003e"
November 26, 2008
jquery下拉菜单特效演示
"\u003cp\u003e出自:http://be.twixt.us/jquery/suckerFish.php\u003c/p\u003e\n\u003ch1 id=\"jquery--suckerfish-style\"\u003e\u003ca href=\"http://blog.haohtml.com/wp-admin/\"\u003ejQuery\u003c/a\u003e » SuckerFish Style\u003c/h1\u003e\n\u003ch2 id=\"purpose\"\u003ePurpose\u003c/h2\u003e\n\u003cp\u003eReplicate Suckerfish Menus.\u003c/p\u003e\n\u003ch3 id=\"original-code\"\u003eOriginal Code\u003c/h3\u003e\n\u003cpre tabindex=\"0\"\u003e\u003ccode\u003e$(document).ready(function(){\n\t$(\u0026#34;#nav-one li\u0026#34;).hover(\n\t\tfunction(){ $(\u0026#34;ul\u0026#34;, this).fadeIn(\u0026#34;fast\u0026#34;); },\n\t\tfunction() { }\n\t);\n\tif (document.all) {\n\t\t$(\u0026#34;#nav-one li\u0026#34;).hoverClass (\u0026#34;sfHover\u0026#34;);\n\t}\n});\n\n$.fn.hoverClass = function(c) {\n\treturn this.each(function(){\n\t\t$(this).hover(\n\t\t\tfunction() { $(this).addClass(c); },\n\t\t\tfunction() { …\u003c/code\u003e\u003c/pre\u003e"