<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>.::灵狼天::. &#187; jQuery</title>
	<atom:link href="http://icyleaf.com/tag/jquery/feed/" rel="self" type="application/rss+xml" />
	<link>http://icyleaf.com</link>
	<description>icyleaf&#039;s blog - 心外无理，心外无物，心外无事</description>
	<lastBuildDate>Tue, 13 Dec 2011 02:34:45 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>jquery Selectors：让你迅速了解 jquery</title>
		<link>http://icyleaf.com/2008/11/jquery-selectors/</link>
		<comments>http://icyleaf.com/2008/11/jquery-selectors/#comments</comments>
		<pubDate>Tue, 18 Nov 2008 02:40:52 +0000</pubDate>
		<dc:creator>icyleaf</dc:creator>
				<category><![CDATA[网络开发]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[jQuery]]></category>

		<guid isPermaLink="false">http://icyleaf.com/?p=448</guid>
		<description><![CDATA[jquery 作为一个风靡流行 JavaScript 框架，一直在互联网开发做着重要的角色，其实它上手也很简单，今天在订阅的 Gr 发现了这个 labs 性的 jquery Selectors。打开这个页面，你会看到在左侧有很多的 jquery 选择器，大家可以通过点击各种的按钮可以在右侧清楚的看到实现选择了那个元素。同时还配有文档说明，很棒的教学学习资料：） 如果你想给离线的朋友使用，那也没有关系，它提供了源码的下载，就在右侧的顶部（点击这里也可以下载）。 看到它这样页面的顶部信息让我有发现了两个很不错 jquery 学习资料网站：LearningjQuery &#124; codylindley。 BTW，人家顶部信息说了：FYI (ie6 != supported)，难道你还在用 IE6 开发么? XD]]></description>
			<content:encoded><![CDATA[<p><a href="http://jquery.com/" target="_self">jquery </a>作为一个风靡流行 JavaScript 框架，一直在互联网开发做着重要的角色，其实它上手也很简单，今天在订阅的 Gr 发现了这个 labs 性的<a href="http://codylindley.com/jqueryselectors/" target="_self"> jquery Selectors</a>。打开这个页面，你会看到在左侧有很多的 jquery 选择器，大家可以通过点击各种的按钮可以在右侧清楚的看到实现选择了那个元素。同时还配有文档说明，很棒的教学学习资料：）</p>
<p>如果你想给离线的朋友使用，那也没有关系，它提供了源码的下载，就在右侧的顶部（<a href="http://www.codylindley.com/jqueryselectors.zip" target="_self">点击这里</a>也可以下载）。</p>
<p>看到它这样页面的顶部信息让我有发现了两个很不错 jquery 学习资料网站：<a href="http://www.learningjquery.com/" target="_self">LearningjQuery</a> | <a href="http://www.codylindley.com/" target="_self">codylindley</a>。</p>
<p>BTW，人家顶部信息说了：<strong>FYI (ie6 != supported)</strong>，难道你还在用 IE6 开发么?<strong> XD<br />
</strong></p>
]]></content:encoded>
			<wfw:commentRss>http://icyleaf.com/2008/11/jquery-selectors/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>表单输入框高亮的几种方法</title>
		<link>http://icyleaf.com/2008/09/form-input-box-to-highlight-the-several-ways/</link>
		<comments>http://icyleaf.com/2008/09/form-input-box-to-highlight-the-several-ways/#comments</comments>
		<pubDate>Wed, 24 Sep 2008 03:31:07 +0000</pubDate>
		<dc:creator>icyleaf</dc:creator>
				<category><![CDATA[网络开发]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[高亮]]></category>

		<guid isPermaLink="false">http://icyleaf.com/?p=376</guid>
		<description><![CDATA[在 Web 开发当作不可免的要碰到表单的输入框，那么当我们在获取一个输入框并输入必要的东西时，怎么样才能让使用者更清楚的知道当前输入的是哪个输入框？ 这就要使用到输入框高亮。目前使用效果最多的有两种，一种是如上图那么整个当前的背景全部高亮；另外一种是仅把当前输入框的边框高亮。原理也很简单，就是当输入框获得和失去焦点是触发事件。 实现方法也有几种： 1. 最简单的方法就是在输入框加入 onfocus 和 onblur 事件并设置执行方法，比如： 优点：除了直接外我不知道说什么 缺点：一个输入框对应一个，多了话就麻烦了，不建议使用。 2. 使用 jQuery 或去他 JavaScript 框架 这里以 jQuery 为例： $(document).ready(function(){ //获得焦点 $("input").focus(function() { // 添加 Class $(this).parent().addClass("curFocus"); }); //失去焦点 $("input").blur(function() { //删除 Class $(this).parent().removeClass("curFocus") }); }); 这里只是把核心代码贴了出来，这里推荐看：Improved &#8230; <a href="http://icyleaf.com/2008/09/form-input-box-to-highlight-the-several-ways/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p><img class="alignnone" src="http://css-tricks.com/wp-content/uploads/2008/04/currentfield.png" alt="" width="500" height="122" /></p>
<p>在 Web 开发当作不可免的要碰到表单的输入框，那么当我们在获取一个输入框并输入必要的东西时，怎么样才能让使用者更清楚的知道当前输入的是哪个输入框？ 这就要使用到<strong>输入框高亮</strong>。目前使用效果最多的有两种，一种是如上图那么整个当前的背景全部高亮；另外一种是仅把当前输入框的边框高亮。原理也很简单，就是<strong>当输入框获得和失去焦点是触发事件</strong>。</p>
<p>实现方法也有几种：<br />
1. 最简单的方法就是在输入框加入 onfocus 和 onblur 事件并设置执行方法，比如：</p>
<pre lang="html4strict" line="1" colla="+">
<!-- 注意留意 onfocus 和 onblur 事件的代码 -->
<input type="text" onblur="this.style.borderColor = '#999'; this.style.backgroundColor = '#F5F5F5';" onfocus="this.style.borderColor = '#0C0'; this.style.backgroundColor = '#FFF';" style="border-color: rgb(153, 153, 153); background-color: rgb(245, 245, 245);"/>
</pre>
<p><span id="more-376"></span><br />
优点：除了直接外我不知道说什么<br />
缺点：一个输入框对应一个，多了话就麻烦了，不建议使用。</p>
<p>2. 使用 jQuery 或去他 JavaScript 框架<br />
这里以 jQuery 为例：</p>
<pre lang="javascript" line="1" colla="+">
$(document).ready(function(){
        //获得焦点
	$("input").focus(function() {
                // 添加 Class
		$(this).parent().addClass("curFocus");
	});

       //失去焦点
       $("input").blur(function() {
                //删除 Class
		$(this).parent().removeClass("curFocus")
	});
});
</pre>
<p>这里只是把核心代码贴了出来，这里推荐看：<a href="http://css-tricks.com/improved-current-field-highlighting-in-forms/" target="_blank">Improved Current Field Highlighting in Forms</a>。里面写的清清楚楚。</p>
<p>3. 纯 CSS 打造<br />
不想或者不会使用 JavaScriot？没有关系，仅 CSS 也可以做出这样的效果哦，不信？好，接着看：我们在写 CSS 的时候会经常使用到几个伪类，尤其是用在链接（a）上面，比如 <strong>a:hover</strong>, <strong>a:visited</strong> 等等，另外还有一个伪类就是 <strong>:focus</strong>，对，没错，获得焦点。<br />
另外在定义输入框需要定义 input ，但是 input 的范围太广，包括了 button, text, password等等的元素。这里需要使用 type 指定某一元素，比如 定义 text ，就是使用：</p>
<pre lang="css" line="1" colla="+">
input[type=text]{}
</pre>
<p>那么好了，使用 CSS 高亮的方法出来了：</p>
<pre lang="css" line="1" colla="+">
            #example input[type=text], #example textarea {
                margin: 5px 5px 5px 0;
                width: 194px;
            }

            #example input[type=text]:focus, #example textarea:focus {
                border: #e6e2af solid;
                -moz-border-radius: 5px;
                -webkit-border-radius: 5px;
                border-radius: 5px;
                border-width: 5px 5px 5px 155px;
                left: -153px;
                margin: 2px 2px 2px 0;
                position: relative;
                z-index: 0;
            }
</pre>
<p>这里还有一个演示，大家直接看源代码吧：<a href="http://users.skumleren.net/cers/examples/formhighlight.html"  target="_blank">使用 CSS 高亮输入框</a></p>
<p>这是我目前收集并了解到的实现方法，希望对大家有多帮助 <img src='http://icyleaf.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
]]></content:encoded>
			<wfw:commentRss>http://icyleaf.com/2008/09/form-input-box-to-highlight-the-several-ways/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Prototype和jQuery的比较之众说纷纭</title>
		<link>http://icyleaf.com/2008/03/prototype-and-the-comparison-of-the-opinions-are-widely-divided-jquery/</link>
		<comments>http://icyleaf.com/2008/03/prototype-and-the-comparison-of-the-opinions-are-widely-divided-jquery/#comments</comments>
		<pubDate>Tue, 25 Mar 2008 02:38:26 +0000</pubDate>
		<dc:creator>icyleaf</dc:creator>
				<category><![CDATA[网络开发]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[Prototype]]></category>

		<guid isPermaLink="false">http://www.icyleaf.cn/2008/03/25/prototype%e5%92%8cjquery%e7%9a%84%e6%af%94%e8%be%83%e4%b9%8b%e4%bc%97%e8%af%b4%e7%ba%b7%e7%ba%ad/</guid>
		<description><![CDATA[Ajax，2007年至今还是最火的一个词，基于Ajax的框架（库）有很多，对于Javascript来说无外乎Prototype和jQuery，或者再加上一个Mootools。不过今天讨论主角是Prototype和jQuery，其实最近我也在学习ajax技术，更准确的是想用一个比较省事的方法学习学习。可是就在这个节骨眼上我犹豫了，不知道如何选择ajax框架（库）。由于我编程使用的是PHP，对于目前ajax资源的如此丰富，纯JavaScript的有Prototype/jQuery/Mootools，基于PHP的ajax框架有sajax/xajax。本来想目前已有了基于PHP的ajax框架，这样更会省去很多的操作，于是我选择了xajax，它的功能和使用上比sajax强大很多，可是不知道是我水平问题还是空间，xajax自身问题，编写出来的代码响应时间很慢&#8230;还不如自己编写的纯Javascript做出的效果。 于是我在PHPChina论坛上寻求帮助，获知还是纯Javascript的比较好，说的最多的就是Prototype和jQuery&#8230;于是我开始了一番搜索和比较得到了如下的结果： 演示文档：原链接 其他一些文章评论： jquery和prototype比较，以及冲突解 prototype.js与jQuery两大阵营的唇枪舌剑 说说我对moo、prototype、JQuery的看法 不用我再说了，相信很多看过上面的朋友大多数会选择jQuery，恩，我再一次“背叛”了mootools，转向了jQuery的怀抱&#8230;. 不过对于mootools我还是不会放弃，比较它还是那么优秀～]]></description>
			<content:encoded><![CDATA[<p>Ajax，2007年至今还是最火的一个词，基于Ajax的框架（库）有很多，对于Javascript来说无外乎<a href="http://www.prototypejs.org/" target="_blank">Prototype</a>和<a href="http://jquery.com/" target="_blank">jQuery</a>，或者再加上一个<a href="http://mootools.net/" target="_blank">Mootools</a>。不过今天讨论主角是Prototype和jQuery，其实最近我也在学习ajax技术，更准确的是想用一个比较省事的方法学习学习。可是就在这个节骨眼上我犹豫了，不知道如何选择ajax框架（库）。由于我编程使用的是PHP，对于目前ajax资源的如此丰富，纯JavaScript的有Prototype/jQuery/Mootools，基于PHP的ajax框架有sajax/xajax。本来想目前已有了基于PHP的ajax框架，这样更会省去很多的操作，于是我选择了xajax，它的功能和使用上比sajax强大很多，可是不知道是我水平问题还是空间，xajax自身问题，编写出来的代码响应时间很慢&#8230;还不如自己编写的纯Javascript做出的效果。</p>
<p style="margin: 0px">于是我在<a href="http://www.phpchina.com/bbs/thread-55908-1-1.html" target="_blank">PHPChina论坛</a>上寻求帮助，获知还是纯Javascript的比较好，说的最多的就是Prototype和jQuery&#8230;于是我开始了一番搜索和比较得到了如下的结果：<br />
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="425" height="355" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="src" value="http://static.slideshare.net/swf/ssplayer2.swf?doc=prototype-jquery-going-from-one-to-the-other-1193346036472971-5" /><embed type="application/x-shockwave-flash" width="425" height="355" src="http://static.slideshare.net/swf/ssplayer2.swf?doc=prototype-jquery-going-from-one-to-the-other-1193346036472971-5" allowscriptaccess="always" allowfullscreen="true"></embed></object><br />
演示文档：<a href="http://www.slideshare.net/remy.sharp/prototype-jquery-going-from-one-to-the-other" target="_self">原链接</a></p>
<p><span id="more-165"></span>其他一些文章评论：<a href="http://yytcpt.blueidea.com/archives/2007/4300.shtml" target="_blank"><br />
jquery和prototype比较，以及冲突解 </a><a href="http://my.donews.com/digitalghost/2006/08/24/kquzalhrllpvynlaeadfddhskqlcdivowmsj/" target="_blank"><br />
prototype.js与jQuery两大阵营的唇枪舌剑</a><br />
<a href="http://www.blogjava.net/iamtin/archive/2007/09/13/reply_to_javaeye_fins_why_leave_prototype_choose_moo.html" target="_blank">说说我对moo、prototype、JQuery的看法</a></p>
<p>不用我再说了，相信很多看过上面的朋友大多数会选择jQuery，恩，我再一次“背叛”了mootools，转向了jQuery的怀抱&#8230;.<br />
不过对于mootools我还是不会放弃，比较它还是那么优秀～</p>
]]></content:encoded>
			<wfw:commentRss>http://icyleaf.com/2008/03/prototype-and-the-comparison-of-the-opinions-are-widely-divided-jquery/feed/</wfw:commentRss>
		<slash:comments>7</slash:comments>
		</item>
	</channel>
</rss>

