jQuery新手常见问题FAQ

在论坛看到不少新手总是问到一些常见问题,在此整理一下:不定时更新

Q1,在IE下动画会闪一下,效果不理想
A,加上DTD定义即可
比如<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Q2,为什么官方的说
Download jQuery 1.2.3 (15kb, Minified and Gzipped),但我下在下来却有
jquery-1.2.3.min.js   52.8 KB
A,显然,他是用了Gzip了(一种服务器端压缩技术,自己GOOGLE)。而不是官网写错了没更新或者是骗人的~

Q3,js的写法:document.getElementById(‘save’).disabled=true;
在jquery中我是这样写的$("#save").disabled = true;  为什么没效果呢

A,这个是典型的问题,其实因为$("#save")出来的其实是jQuery对象,而不是普通DOM对象
这是新手常见的问题。
解决方法有2:
1,用JQ写法,$("#save").attr("disabled","true");
2,转成DOM写法$("#save")[0].disabled=true;
当然,$("#save")[0]也可以写成$("#save").get(0)。他返回的也是DOM元素

Q4,在框架页中,如何操作父窗口的对象
A,引用UPC的方法

没找到很好的方法
只好用DOM方法与jquery方法结合的方式实现了

1.在父窗口中操作 选中IFRAME中的所有单选钮
$(window.frames["iframe1"].document).find("input[type=’radio’]").attr("checked","true");

2.在IFRAME中操作 选中父窗口中的所有单选钮
$(window.parent.document).find("input[type=’radio’]").attr("checked","true");

iframe框架的:<iframe src="test.html" id="iframe1" width="700" height="300" frameborder="0" scrolling="auto"></iframe>

IE7中测试通过 回去你自己试试吧

实现的原理其实很简单 就是用到了$(DOM对象)可以转换成jquery对象
==================================================

不过我的方法是
window.parent.jQuery("input[name=validate]").val("&amp;amp;lt;%=Session("GetCode")%&amp;amp;gt;");
这段是来自我博客的自动填写验证码的,有兴趣可分析下我的FOOTER里的那个框架。
其实本质上和UPC的方法是一样的。大家可以借鉴参考

jQuery API 参考文档中文版翻译接近尾声

终于快翻完了,还有AJAX部分的一点点了。累啊
大家可以在老地方看到
http://shawphy.com/jqueryapi/
发现什么问题及时过来留言啊

我这还是基于为之漫笔的1.1的API翻译的呢……
(整理、增删、校对等)
远没有他当年的幸苦呢。

传他翻译的《jQuery 基础教程》快要发布了。(就是Learning jQuery)
祝他翻的好吧~~

好了,更多感谢话等正式发布后再写吧~
睡了

jQuery API 继续更新

前些天回来,才发现了Cloudream 的留言。赶紧联系之。
现在这个API有了其加入,完整版很快将会与大家见面的了。
这次更新主要是将翻译进行到了CSS部分了。还剩下事件,效果,AJAX,工具四个部分了。
并且Cloudream 连夜制作了英文说明的开关功能,以及给文件瘦身~在此大家感谢一下他~~~

PS,由于翻译方便,所以此功能尚不能完整使用,待完全翻译后即可使用。
PS2,本人说实话不是很喜欢Visual jQuery的样式,感觉moo的文档更简洁漂亮,支持的回帖。。。。

地址依然不变http://shawphy.com/jqueryapi/

==============================

截止至当前发稿时,我又Update了一下,发现Cloudream又更新了。。。。
现在工具部分也完成了。真是膜拜一下夜猫子啊……
我先睡了……各位晚安~o ya si mi….

Edit Plus 3.00 发布

Edit Plus 3.00 终于是发布了,但从冗长的What’s New里边看不到激动人心的重大革新,感觉充其量也只能算是从2.31版升级到了2.4版而已。也许EmEditor这个万年BETA王也因此收到鼓动一下子整出个Final了。tracky很厉害,很快就出了中文版了。大家可以到汉化新世纪这里来下载。2.x的注册码依然可以用。附一个霏凡的:

Name:crsky
Code:A779E-5BF58-63RAC-42O59-66RAC

大家装的时候小心插件…… 这个editplus实在很顺手的原因之一就是自动完成功能,可以到这里看看 再转一个,因为找不到作者了。让EP能直接编译和运行JAVA程序。

Tools->参数设置->配置用户工具
   1.添加工具(添加应用程序)
    菜单文字:Compile Java Program
    程序:C:JDKbinjavac.exe
    参数:文件名称
    初始目录:文件目录

   2.添加工具(添加应用程序)
    菜单文字:Run Java Program
    程序:C:JDKbinjava.exe
    参数:文件名称(不含扩展名)
    初始目录:文件目录

 

   工具组名称可以随便添,比如Debug Java Program。  然后在Tools的下拉菜单中,你就会看见Compile Java Program以及Run Java Program这两个选项,以后你就可以利用ctrl + 1编译和ctrl +2运行程序了

附注:本来这博客是用ScribFire写的,但可惜PJBLOG的API不是很标准,现在发布失败,还害得我写了两遍,郁闷。。。逼我用WordPress去啊……

==============
再注:原来之前发布成功了……但是果然API不够标准,没有正确返回成功的消息。害得我还把之前发的删除了……唉。。。

JQuery发布1.2.3

转载自:http://www.cnblogs.com/thinhunan/archive/2008/02/15/JQuery_1_2_3_released.html
———————————————————————————————————————————
发现自己对JQuery还是挺关注的
http://jquery.com/blog/2008/02/08/jquery-123-air-namespacing-and-ui-alpha/
主要变化:

  1. 兼容AIR(Adobe® Integrated Runtime (AIR™)),[关于Adobe AIRAdobe AIR技术优势 ]
  2. .data() & .removeData()
    往对象上附加数据和移除数据,$.data(element);//返回一个UniqueID$.data(element,’dataname’)或者$(element).data(dataname);//返回值 $.data(element,dataname,datavalue)或$(element).(dataname,datavalue);//设置值
  3. .bind(".namespace") .unbind(”.namespace”)
    JQuery1.2支持namespaced event,特定命名空间的事件,就是说多个事件响应可以分组
    $("div").bind("click.plugin", function(){});
    $("div").bind("mouseover.plugin", function(){});
    $("div").unbind(".plugin"); // All handlers removed
  4. .trigger(”click!”)
    .trigger()用来触发事件,同样支持特定命名空间的事件方式
    $("div").bind("click", function(){ alert("hello"); });
    $("div").bind("click.plugin", function(){ alert("goodbye"); });
    $("div").trigger("click!"); // alert("hello") only

    还有一个.triggerHandler()方法,用法和trigger()差不多,但它只触发绑定的事件响应函数,不触发浏览器默认的响应方式。

  5. Alpha Release: jQuery UI 1.5 and jQuery Enchant 1.0[我还没去看]

在jQuery中用:contains过滤表格内容

愈发的觉得在jQuery中写东西真是简单实惠啊。看下面咯。

开课日期
上课地点
上课时段
开课日期 上课地点 上课时段 优惠价 报名
2008-01-16 徐汇 早上 2680
2008-01-30 黄埔 早上 2680
2008-01-30 徐汇 周日全天 2680

<script type="text/javascript">
$(function(){
$("#courses_select select").change(function () {
if($(this).val()=="全部"){
$("#more_courses tbody tr").show();
}else{
$("#more_courses tbody tr").hide().filter(":contains("+$(this).val()+")").show();
}
});
});
</script>
<p>&nbsp;</p>
<div id="more_courses">
<div id="courses_select"><dl><dt>开课日期</dt><dd><select size="6">
<option>全部</option>
<option>2008-01-13</option>
<option>2008-01-30</option>
<option>2008-01-16</option>
</select> </dd><dt>上课地点</dt><dd class="hide"><select size="6">
<option>全部</option>
<option>黄埔</option>
<option>徐汇</option>
</select> </dd><dt>上课时段</dt><dd class="hide"><select size="6">
<option>全部</option>
<option>早上</option>
<option>晚上</option>
<option>周日全天</option>
</select> </dd></dl></div>
<div>
<table>
<thead>
<tr>
<th>开课日期</th><th>上课地点</th><th>上课时段</th><th>优惠价</th><th>报名</th>
</tr>
</thead>
<tbody>
<tr>
<td>2008-01-16</td>
<td>徐汇</td>
<td>早上</td>
<th>2680</th>
<td><button onclick="location.href='#'"><span></span>我要报名</button></td>
</tr>
<tr>
<td>2008-01-30</td>
<td>黄埔</td>
<td>早上</td>
<th>2680</th>
<td><button onclick="location.href='#'"><span></span>我要报名</button></td>
</tr>
<tr>
<td>2008-01-30</td>
<td>徐汇</td>
<td>周日全天</td>
<th>2680</th>
<td><button onclick="location.href='#'"><span></span>我要报名</button></td>
</tr>
</tbody>
</table>
</div>
</div>

Web Developer 汉化测试版以及 Firebug 中文汉化版下载

前些天我抽空汉化了一下Web Developer这个Firefox插件,他是用来查看和调试页面信息的好工具,众多的书籍中说道调试网页就会说起这个工具,还有Firebug也是一个很出色的调试工具。这位仁兄详细介绍了美妙的Firebug,强烈推荐下载使用。

这里简单的介绍下Web Developer


[quote]Web Developer 可说是网页设计师最常使用的一个 Firefox 扩充套件,它可以协助我们在设计网页时能够更加的得心易手,内建 HTML、CSS、Feed…等检验器,让我们所设计出来的网页能够符合标准化,不但可以省下日后维护的时间金钱,更能确保我们所设计出来的网页在各家不同的浏览器,均能正常地显示,且是符合我们预想的成果。其它更有取消 CSS、取消 Java、取消 JavaScript、检视或清除 Cookies…等功能。

CSS — 可编辑当前页面的CSS,并可即时显示修改效果。
Forms — Get/Post转换,显示所有表单信息。
Images — 显示图片的各种属性,可找出未设置Alt,Title等属性的图片。
Information — 最有用的两个功能:查看Cookie信息和Http Response数据,Web调试必备
Micellaneous — 最有用的功能:Clear Session Cookie。 已往调试Web,为了新开一个Session,不得不关闭IE,重新再开,现在不用啦。
Outline — 框出Table元素,Cell元素,Div元素
Resize — 模拟800*600等窗口大小,可自定义窗口大小
Tools — 验证CSS/HTML 等
View Source — 显示带关键字颜色的漂亮源代码[/quote]

如果测试中发现什么问题请及时告知,谢谢~~
如果测试没什么问题,此汉化将在官方网站上统一发布。
另外顺便发一下Firebug中文版,这个虽然不是我翻译的,但整合了一下。
如果你还没有用Firefox那快去用吧!

xpi使用方法:在firefox打开的情况下,将文件拖入firefox的窗口即可开始安装。
点击下载Firebug和Web Developer

============================================================
中邪了,这个服务器怎么不认得xpi文件,大家点下面两个链接会说文件不存在,但大家看这里,明明文件就在那嘛!莫名其妙的……

点击下载Web Developer
点击下载Firebug

jQuery 1.2 API翻译至50%

终于好不容易翻译到了50%了,发此文纪念一下。大家可以从 http://shawphy.com/jqueryapi/ 来查看
中间肯定有不少BUG,可以在这里给我反馈。

翻译期间发现原来的1.1版中确实也有些小错误的。
比如关于end()的翻译中,提到,如果前面的操作(对元素列表的状态)没有破坏性,则什么也不改变。
实际上,如果前面的操作(对元素列表的状态)没有破坏性,那就返回空集

当然,在新版中,关于end()的用法讲的更加明确了

[quote]回到最近的一个"破坏性"操作之前。即,将匹配的元素列表变为前一次的状态。
如果之前没有破坏性操作,则返回一个空集。所谓的"破坏性"就是指任何改变所匹配的jQuery元素的操作。这包括在 Traversing 中任何返回一个jQuery对象的函数–'add', 'andSelf', 'children', 'filter', 'find', 'map', 'next', 'nextAll', 'not', 'parent', 'parents', 'prev', 'prevAll', 'siblings' and 'slice'–再加上 Manipulation 中的 'clone'。[/quote]

注意,所有的wrap函数都不会改变原来选择的对象。

翻译真幸苦,接下来几天我将停止更新,大概到下个星期再开始更新这里。

BTW,我之所以说我翻译了50%,因为总共有6000多行,我翻译了3000行了。
目前进度是Traversing之前的所有以及Traversing中Filtering和Chaining翻译掉了。

  • Core 95%
  • Selectors 100%
  • Attributes 100%
  • Traversing 50%
  • Manipulation 0%
  • CSS 0%
  • Events 0%
  • Effetcs 0%
  • Ajax 0%
  • Utilities 0%

jQuery的学习方法

中文的资料不多
基本上就是几个

第一步:入门
首选的就是
jQuery的起点教程
上面那个是基础,看了上面就会有对jQuery有个大概的了解,本人就是从那个开始学起的之后就是看API了。
注意,那个是1.1的,实际中使用1.2的版本时会有差异。参看:http://shawphy.com/article.asp?id=7
以及,jQuery的精髓,选择器(重点看):http://shawphy.com/article.asp?id=8

第二步:提升
现在有的是中文版的1.1的API,可以在这里看
http://jquery.org.cn/visual/cn/index.xml
1.2仿visual的API可以看
http://shawphy.com/jqueryapi/
但这个是英文版的,中文版翻译中。
如果英文比较好,期间建议你去他们官网http://jQuery.com/去看看。会有帮助的,以及一本书Learning jQuery的英文版 http://shawphy.com/down/learningjquery.rar 可以拿来看看。据说这本书的中文版将在08年3、4月份出版,可以关注一下。

第三步,交流
不可否认,交流是很重要的。建议去国内唯一还算有点人气的jQuery社区
http://bbs.jquery.org.cn/
遇到问题那里会有些人帮你解答,我也在那里混的~~
顺便一提,http://cssrain.cn/ 收集了论坛中的很多问题。可以去那里看看精华部分。
更多资料以后再补充。

jQuery API 1.2 翻译中

之前从某个网站(现在想不起来名字了,得翻墙出去,如果有条件可以在里边找到链接,可能叫做kiss,感谢一下),找到了这个版本,仿visual jquery的。非常不错,就决定基于这个版本将其jQuery 1.2 的API翻译一下。
翻译真是件苦差事……
只好慢慢来了,手头还有项目呢……
现在先翻译了大概15%,已经将Core的全部和Selector的大部分翻译完成了,当然还是要校对的。
在此再感谢一下www.chinasvn.com提供了免费的svn服务器。可以帮我控制版本。如果有希望一起合作的朋友,也一起来加入翻译。当然要是会用svn就更好了~

地址:http://shawphy.com/jqueryapi/
由于尚未完成,暂时不提供本地下载的打包文件,如果需要离线文档,可以先下载英文版的:
http://shawphy.com/jqueryapi/jQuery_doc_1.2.zip