手机浏览 RSS 2.0 订阅 膘叔的简单人生 , 腾讯云RDS购买 | 超便宜的Vultr , 注册 | 登陆
浏览模式: 标准 | 列表分类:Javascript

jquery笔记：让input从disabled变成enabled

Submitted by gouki on 2010, September 9, 3:35 PM

在页面处理的时候，有时候我们会使用这样的小技巧，在没有点击XX按钮时，YY按钮是disabled的，当选中了XX时，YY也变成了enabled的状态。

在使用普通的JS的时候，我们很可能就直接document.getElementById('YY').disabled = false;就解决了。但是在jQuery里却不是每个浏览器都支持这样的作法，即：$('#yy').attr('disabled',false);也试了一下$('#yy').attr('disabled','');，不知道是我的人品问题还是确实 有问题，反正都没有成功，于是我又尝试$('#yy').attr('enabled','enabled')，也没有成功。 最后一发狠，来了一句：$('#yy').removeAttr('disabled')，得成了。

果然还是怕狠人的。在这里做个记录而已。虽然大多数情况下不一定用得到。

Tags: jquery, inpu, disabled, enabled

Javascript | 评论:0 | 阅读:21052

支持智能手机的JS框架

Submitted by gouki on 2010, September 7, 11:00 AM

智能手机现在是越来越被大众接受，即使是诺基亚那可怜的S40，也能将就着算是智能机吧。关键这些智能机里都有一些浏览器了。比如opera mini,opera mobile之类的，再象android那样的话就是Webkit，IOS也算是Webkit核心了（ff也要登录android之类的），opera也在各个平台都有着自己的版本。因此，我们可以假设，只要是智能手机，都能支持一些简单的JS了。但是我怎么知道哪些浏览器支持的JS在其他浏览器上不支持呢？如果只用最简化的功能，那意义就不大了。因此，支持智能手机的JS框架就比较让人心动了。

一、jQuery Mobile

jQueryMobile不像前面SproutCore 或者Sencha Touch，它没有提供一个完整的应用架构。但它是一个新的开始，其也以向移动网站应用提供更多本地化的控制为宗旨。jQuery Mobile项目宣布其要成为“完整的，统一的，移动UI架构”。 jQuery Mobile核心项目也将继续为移动提供优化，但jQuery Mobile更专注于为主流智能手机浏览器提供一种真正的顶级的JS体验和界面。

官方网址：http://jquerymobile.com/

支持列表：http://jquerymobile.com/gbs/

二、Sencha Touch

Sencha前身是Ext JS ，全名是Sencha Touch HTML5 mobile framework.它提供一种可跨平台的架构，目前支持IOS，Android将在不久后得到支持。这种在线摸触摸技术结合了一个UI库的独立解决方 案，触摸项目管理、地理技术支持、离线缓存技术以及特殊的CSS和CSS3功能。

官方网址：http://www.sencha.com/products/touch/

演示地址：http://www.sencha.com/products/touch/demos.php

三、YUI 3.2

雅虎将发布最新的JS实用程序的YUI库。YUI最新版对触摸和移动设备提供更多更好的支持

官方网址：http://yuilibrary.com/

四、iUI

iUI是一个iPhone用户界面架构，其设计目标是像移动网站应用提供更接近iPhone的体验。它的工作原理是结合WEBKIT为基础的设备以及包括一个JS库和CSS及图形。其最早追溯至2007年，但多年以来缓慢地升级以提供更多其他设备，甚至是iPad。

官方网址：http://code.google.com/p/iui/

五、SproutCore

SproutCore是一个HTML5的架构，目标帮助开发者建立桌面口径的web应用，并且支持任何浏览器下无需补丁的运行。其项目带头大哥已经辞去了其原本苹果的职位，专心致志地来完成此项目。

官方网址：http://www.sproutcore.com/

演示地址：http://demo.sproutcore.com/

六、XUI

在开发Phonegap时，XUI团队对应用于移动设备的现存JS库及表现很失望。XUI创建的初衷是跨多个移动浏览器工作，其包括WEBKIT，Fennec，Opera。其目标是为低成本条件下解决传统JS库不适合移动浏览器，提供更多跨兼容的方案。

官方网址：http://xuijs.com/

英文原版：http://mashable.com/2010/08/18/mobile-web-app-frameworks/

内容来自：http://www.biaodianfu.com/make-your-mobile-websites-act-like-apps.html

Tags: 智能手机, js框架

Javascript | 评论:1 | 阅读:24824

JavaScript—计算图片加载的张数

Submitted by gouki on 2010, September 6, 5:07 PM

看到cssrain.cn上这篇博客介绍的不错。挺有意思，虽然这个功能在很久以前就有人实现过。。。但现在看来又有不同的感觉
或许大家都记得，在几年前，网页特效中就有一个效果是网页正在下载数据，请稍等。然后是一个进度条，等完毕后，网页就打开了。其实说的就是Cssrain上的效果。不过几年前没有想过要兼容如今这么多的浏览器。所以，还是可以再了解一下（相册网站之类的可能会需要）
----START--

先定义一个图片的数组，然后通过image的onload事件来计算，注意，onload在ie和火狐有所不同。

最后需要一个进度条与之结合即可。

这个脚本在做游戏的地方用得比较多。

http://cssrain.cn/demo/plantsvs/loadImg.html

» 阅读全文

Javascript | 评论:0 | 阅读:17203

GreaseMonkey with jQuery

Submitted by gouki on 2010, August 30, 10:00 AM

习惯了用jQuery，因此在使用greasemonkey的时候，也总是想着用jQuery，找了下，确实有这样的例子。。

JavaScript代码
  1. var $;  
  2.   
  3. // Add jQuery  
  4.     (function(){  
  5.         if (typeof unsafeWindow.jQuery == 'undefined') {  
  6.             var GM_Head = document.getElementsByTagName('head')[0] || document.documentElement,  
  7.                 GM_JQ = document.createElement('script');  
  8.       
  9.             GM_JQ.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js';  
  10.             GM_JQ.type = 'text/javascript';  
  11.             GM_JQ.async = true;  
  12.       
  13.             GM_Head.insertBefore(GM_JQ, GM_Head.firstChild);  
  14.         }  
  15.         GM_wait();  
  16.     })();  
  17.   
  18. // Check if jQuery's loaded  
  19.     function GM_wait() {  
  20.         if (typeof unsafeWindow.jQuery == 'undefined') {  
  21.             window.setTimeout(GM_wait, 100);  
  22.         } else {  
  23.             $ = unsafeWindow.jQuery.noConflict(true);  
  24.             letsJQuery();  
  25.         }  
  26.     }  
  27.   
  28. // All your GM code must be inside this function  
  29.     function letsJQuery() {  
  30.         alert($); // check if the dollar (jquery) function works  
  31.         alert($().jquery); // check jQuery version  
  32.     }  

然后代码就得全部扔在letsJQuery()方法里了。
由于是async，所以，尽量选择快一点地址，比如本地的localhost之类的，HOHO，不过，这就得本地WEB服务常开了。

原文来自：http://joanpiedra.com/jquery/greasemonkey/

Tags: greasemonkey, jquery

Javascript | 评论:0 | 阅读:20198

js模拟php:print_r

Submitted by gouki on 2010, August 24, 2:04 PM

在PHP中，我们打印一个数组或者对象的时候，都是用print_r，相对比较直观，可是javascript就不行。翻了翻资料，也看到一些代码的写法。这里是一个简单的处理（不能打印window,document等对象）：

JavaScript代码
  1. function print_r( $value ){  
  2.     if($value.constructor == Array || $value.constructor == Object ){  
  3.         document.write("<ul>");  
  4.         for (var $i in $value){  
  5.             if($value[$i].constructor == Array || $value[$i].constructor == Object ){  
  6.                 document.write("<li>["+$i+"] => " + typeof( $value ) + " </li><ul>");  
  7.                 print_r($value[$i]);  
  8.                 document.write("</ul>");  
  9.             }else{  
  10.                 document.write("<li>["+$i+"] => " + $value[$i] + "</li>");  
  11.             }  
  12.         }  
  13.         document.write("</ul>");  
  14.     }  
  15. }  
  16. var s = {};  
  17. s.i = '123';  
  18. s.o = {};  
  19. s.o.test = 'tt';  
  20. print_r(s);  

 

然后看了一下phpjs.org，它上面的print_r就比较复杂了。。。

JavaScript代码
  1. function print_r (array, return_val) {  
  2.     // Prints out or returns information about the specified variable    
  3.     //   
  4.     // version: 1008.1718  
  5.     // discuss at: http://phpjs.org/functions/print_r    // +   original by: Michael White (http://getsprink.com)  
  6.     // +   improved by: Ben Bryan  
  7.     // +      input by: Brett Zamir (http://brett-zamir.me)  
  8.     // +      improved by: Brett Zamir (http://brett-zamir.me)  
  9.     // +   improved by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)    // -    depends on: echo  
  10.     // *     example 1: print_r(1, true);  
  11.     // *     returns 1: 1  
  12.       
  13.     var output = "", pad_char = " ", pad_val = 4, d = this.window.document;    var getFuncName = function (fn) {  
  14.         var name = (/\W*function\s+([\w\$]+)\s*\(/).exec(fn);  
  15.         if (!name) {  
  16.             return '(Anonymous)';  
  17.         }        return name[1];  
  18.     };  
  19.    
  20.     var repeat_char = function (len, pad_char) {  
  21.         var str = "";        for (var i=0; i < len; i++) {  
  22.             str += pad_char;  
  23.         }  
  24.         return str;  
  25.     };   
  26.     var formatArray = function (obj, cur_depth, pad_val, pad_char) {  
  27.         if (cur_depth > 0) {  
  28.             cur_depth++;  
  29.         }   
  30.         var base_pad = repeat_char(pad_val*cur_depth, pad_char);  
  31.         var thick_pad = repeat_char(pad_val*(cur_depth+1), pad_char);  
  32.         var str = "";  
  33.          if (typeof obj === 'object' && obj !== null && obj.constructor && getFuncName(obj.constructor) !== 'PHPJS_Resource') {  
  34.             str += "Array\n" + base_pad + "(\n";  
  35.             for (var key in obj) {  
  36.                 if (obj[key] instanceof Array) {  
  37.                     str += thick_pad + "["+key+"] => "+formatArray(obj[key], cur_depth+1, pad_val, pad_char);                } else {  
  38.                     str += thick_pad + "["+key+"] => " + obj[key] + "\n";  
  39.                 }  
  40.             }  
  41.             str += base_pad + ")\n";        } else if (obj === null || obj === undefined) {  
  42.             str = '';  
  43.         } else { // for our "resource" class  
  44.             str = obj.toString();  
  45.         }   
  46.         return str;  
  47.     };  
  48.    
  49.     output = formatArray(array, 0, pad_val, pad_char);   
  50.     if (return_val !== true) {  
  51.         if (d.body) {  
  52.             this.echo(output);  
  53.         }        else {  
  54.             try {  
  55.                 d = XULDocument; // We're in XUL, so appending as plain text won't work; trigger an error out of XUL  
  56.                 this.echo('<pre xmlns="http://www.w3.org/1999/xhtml" style="white-space:pre;">'+output+'</pre>');  
  57.             }            catch (e) {  
  58.                 this.echo(output); // Outputting as plain text may work in some plain XML  
  59.             }  
  60.         }  
  61.         return true;    } else {  
  62.         return output;  
  63.     }  
  64. }  

 

果然是没有做不到的事，只有想不到的事呀。。。（上面的phpjs.org的print_r需要echo方法，请到phpjs.org下载）

Tags: print_r, php

Javascript | 评论:0 | 阅读:22994

Records:306«‹21222324252627282930›»