<?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>Steele &#187; code</title>
	<atom:link href="http://steelebranding.com/tag/code/feed/" rel="self" type="application/rss+xml" />
	<link>http://steelebranding.com</link>
	<description>Just another WordPress weblog</description>
	<lastBuildDate>Tue, 10 Aug 2010 22:36:47 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.1</generator>
		<item>
		<title>Shorthand methods for unbind in jQuery</title>
		<link>http://steelebranding.com/2009/10/28/shorthand-methods-for-unbind-in-jquery/</link>
		<comments>http://steelebranding.com/2009/10/28/shorthand-methods-for-unbind-in-jquery/#comments</comments>
		<pubDate>Wed, 28 Oct 2009 18:01:38 +0000</pubDate>
		<dc:creator>Brant</dc:creator>
				<category><![CDATA[New Media]]></category>
		<category><![CDATA[code]]></category>
		<category><![CDATA[events]]></category>
		<category><![CDATA[example]]></category>
		<category><![CDATA[external]]></category>
		<category><![CDATA[html]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[unbind]]></category>

		<guid isPermaLink="false">http://new.steele-associates.com/?p=142</guid>
		<description><![CDATA[Originally found on the Learning jQuery blog by Karl Swedberg Someone sent me an email the other day, asking that I add shorthand methods for .unbind(eventType) to the jQuery core file. He argued that since jQuery provides shorthands such as .click() for .bind(&#39;click&#39;), it should also include .unclick() for .unbind(&#39;click&#39;) for consistency. But he didn&#39;t [...]]]></description>
			<content:encoded><![CDATA[<p>
	Originally found on the Learning jQuery blog by <a href="http://www.englishrules.com">Karl Swedberg</a></p>
<p>
	Someone sent me an email the other day, asking that I add shorthand methods for <code>.unbind(eventType)</code> to the jQuery core file. He argued that since jQuery provides shorthands such as <code>.click()</code> for <code>.bind(&#39;click&#39;)</code>, it should also include <code>.unclick()</code> for <code>.unbind(&#39;click&#39;)</code> for consistency. But he didn&#39;t consider two things:</p>
<ol>
<li>
		I can&#39;t change jQuery&#39;s API.</li>
<li>
		Those shorthand methods used to be part of jQuery core, but with the release of 1.0, John Resig cleaned up the API quite a bit, removing all of the <code>.un<em>Event</em>()</code> and <code>.one<em>Event</em>()</code> methods.</li>
</ol>
<p>
	While I understand the desire for simplicity in developers&#39; code and consistency in jQuery&#39;s API, I think Mr. Resig made the right decision removing the shorthand methods. Keeping both &quot;un&quot; and &quot;one&quot; shorthands in there would have meant an additional 44 methods, with very little gain for most users of the library. Nevertheless, it&#39;s fairly trivial to create a plugin for this sort of thing.</p>
<p><span id="more-142"></span>
<p>
	If we want the shorthand methods for a particular project, we can simply iterate through an array of event types and add the &quot;un&quot; or &quot;one&quot; method to the jQuery prototype (<code>jQuery.fn</code>). Here is what it might look like:</p>
<div class="igBar">
	<span id="ljavascript-1"><a href="http://www.learningjquery.com/2009/06/shorthand-methods-for-unbind#" onclick="javascript:showPlainTxt('javascript-1'); return false;">PLAIN TEXT</a></span></div>
<div class="syntax_hilite">
	<span class="langName">JavaScript:</span></p>
<div id="javascript-1">
<div class="javascript" style="font-family: monospace;">
<ol>
<li style="font-weight: normal; vertical-align: top; color: rgb(172, 170, 154);">
<div style="margin: 0pt; padding: 0pt; background: transparent none repeat scroll 0% 0%; font-family: monospace; font-style: normal; font-variant: normal; font-weight: normal; font-size: 1em; line-height: 1.2em; font-size-adjust: none; font-stretch: normal; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; vertical-align: top;">
						<span style="color: rgb(0, 153, 0);">(</span><span style="color: rgb(0, 51, 102); font-weight: bold;">function</span><span style="color: rgb(0, 153, 0);">(</span>$<span style="color: rgb(0, 153, 0);">)</span> <span style="color: rgb(0, 153, 0);">{</span></div>
</li>
<li style="font-weight: bold; vertical-align: top; color: rgb(172, 170, 154);">
<div style="margin: 0pt; padding: 0pt; background: transparent none repeat scroll 0% 0%; font-family: monospace; font-style: normal; font-variant: normal; font-weight: normal; font-size: 1em; line-height: 1.2em; font-size-adjust: none; font-stretch: normal; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; vertical-align: top;">
						&nbsp; <span style="color: rgb(0, 51, 102); font-weight: bold;">var</span> eventTypes <span style="color: rgb(51, 153, 51);">=</span> <span style="color: rgb(0, 153, 0);">[</span><span style="color: rgb(51, 102, 204);">&#39;blur&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;focus&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;resize&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;scroll&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;click&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;dblclick&#39;</span><span style="color: rgb(51, 153, 51);">,</span></div>
</li>
<li style="font-weight: normal; vertical-align: top; color: rgb(172, 170, 154);">
<div style="margin: 0pt; padding: 0pt; background: transparent none repeat scroll 0% 0%; font-family: monospace; font-style: normal; font-variant: normal; font-weight: normal; font-size: 1em; line-height: 1.2em; font-size-adjust: none; font-stretch: normal; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; vertical-align: top;">
						&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: rgb(51, 102, 204);">&#39;mousedown&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;mouseup&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;mousemove&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;mouseover&#39;</span><span style="color: rgb(51, 153, 51);">,</span></div>
</li>
<li style="font-weight: bold; vertical-align: top; color: rgb(172, 170, 154);">
<div style="margin: 0pt; padding: 0pt; background: transparent none repeat scroll 0% 0%; font-family: monospace; font-style: normal; font-variant: normal; font-weight: normal; font-size: 1em; line-height: 1.2em; font-size-adjust: none; font-stretch: normal; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; vertical-align: top;">
						&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: rgb(51, 102, 204);">&#39;mouseout&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;mouseenter&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;mouseleave&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;change&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;select&#39;</span><span style="color: rgb(51, 153, 51);">,</span></div>
</li>
<li style="font-weight: normal; vertical-align: top; color: rgb(172, 170, 154);">
<div style="margin: 0pt; padding: 0pt; background: transparent none repeat scroll 0% 0%; font-family: monospace; font-style: normal; font-variant: normal; font-weight: normal; font-size: 1em; line-height: 1.2em; font-size-adjust: none; font-stretch: normal; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; vertical-align: top;">
						&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="color: rgb(51, 102, 204);">&#39;submit&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;keydown&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;keypress&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;keyup&#39;</span><span style="color: rgb(51, 153, 51);">,</span><span style="color: rgb(51, 102, 204);">&#39;error&#39;</span><span style="color: rgb(0, 153, 0);">]</span>;</div>
</li>
<li style="font-weight: bold; vertical-align: top; color: rgb(172, 170, 154);">
<div style="margin: 0pt; padding: 0pt; background: transparent none repeat scroll 0% 0%; font-family: monospace; font-style: normal; font-variant: normal; font-weight: normal; font-size: 1em; line-height: 1.2em; font-size-adjust: none; font-stretch: normal; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; vertical-align: top;">
						&nbsp;</div>
</li>
<li style="font-weight: normal; vertical-align: top; color: rgb(172, 170, 154);">
<div style="margin: 0pt; padding: 0pt; background: transparent none repeat scroll 0% 0%; font-family: monospace; font-style: normal; font-variant: normal; font-weight: normal; font-size: 1em; line-height: 1.2em; font-size-adjust: none; font-stretch: normal; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; vertical-align: top;">
						&nbsp; <a href="http://www.learningjquery.com/wp-content/themes/ljq/docs.php?fn=$.each"><span style="">$.<span style="color: rgb(102, 0, 102);">each</span></span></a><span style="color: rgb(0, 153, 0);">(</span>eventTypes<span style="color: rgb(51, 153, 51);">,</span> <span style="color: rgb(0, 51, 102); font-weight: bold;">function</span><span style="color: rgb(0, 153, 0);">(</span><a href="http://www.learningjquery.com/wp-content/themes/ljq/docs.php?fn=index"><span style="">index</span></a><span style="color: rgb(51, 153, 51);">,</span> eventType<span style="color: rgb(0, 153, 0);">)</span> <span style="color: rgb(0, 153, 0);">{</span></div>
</li>
<li style="font-weight: bold; vertical-align: top; color: rgb(172, 170, 154);">
<div style="margin: 0pt; padding: 0pt; background: transparent none repeat scroll 0% 0%; font-family: monospace; font-style: normal; font-variant: normal; font-weight: normal; font-size: 1em; line-height: 1.2em; font-size-adjust: none; font-stretch: normal; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; vertical-align: top;">
						&nbsp; &nbsp; jQuery.<span style="color: rgb(102, 0, 102);">fn</span><span style="color: rgb(0, 153, 0);">[</span> <span style="color: rgb(51, 102, 204);">&#39;un&#39;</span> <span style="color: rgb(51, 153, 51);">+</span> eventType <span style="color: rgb(0, 153, 0);">]</span> <span style="color: rgb(51, 153, 51);">=</span> <span style="color: rgb(0, 51, 102); font-weight: bold;">function</span><span style="color: rgb(0, 153, 0);">(</span> fn <span style="color: rgb(0, 153, 0);">)</span> <span style="color: rgb(0, 153, 0);">{</span></div>
</li>
<li style="font-weight: normal; vertical-align: top; color: rgb(172, 170, 154);">
<div style="margin: 0pt; padding: 0pt; background: transparent none repeat scroll 0% 0%; font-family: monospace; font-style: normal; font-variant: normal; font-weight: normal; font-size: 1em; line-height: 1.2em; font-size-adjust: none; font-stretch: normal; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; vertical-align: top;">
						&nbsp; &nbsp; &nbsp; <span style="color: rgb(0, 0, 102); font-weight: bold;">return</span> <span style="color: rgb(0, 0, 102); font-weight: bold;">this</span>.<a href="http://www.learningjquery.com/wp-content/themes/ljq/docs.php?fn=unbind"><span style="">unbind</span></a><span style="color: rgb(0, 153, 0);">(</span> eventType<span style="color: rgb(51, 153, 51);">,</span> fn <span style="color: rgb(0, 153, 0);">)</span> ;</div>
</li>
<li style="font-weight: bold; vertical-align: top; color: rgb(172, 170, 154);">
<div style="margin: 0pt; padding: 0pt; background: transparent none repeat scroll 0% 0%; font-family: monospace; font-style: normal; font-variant: normal; font-weight: normal; font-size: 1em; line-height: 1.2em; font-size-adjust: none; font-stretch: normal; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; vertical-align: top;">
						&nbsp; &nbsp; <span style="color: rgb(0, 153, 0);">}</span>;</div>
</li>
<li style="font-weight: normal; vertical-align: top; color: rgb(172, 170, 154);">
<div style="margin: 0pt; padding: 0pt; background: transparent none repeat scroll 0% 0%; font-family: monospace; font-style: normal; font-variant: normal; font-weight: normal; font-size: 1em; line-height: 1.2em; font-size-adjust: none; font-stretch: normal; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; vertical-align: top;">
						&nbsp; <span style="color: rgb(0, 153, 0);">}</span><span style="color: rgb(0, 153, 0);">)</span>;</div>
</li>
<li style="font-weight: bold; vertical-align: top; color: rgb(172, 170, 154);">
<div style="margin: 0pt; padding: 0pt; background: transparent none repeat scroll 0% 0%; font-family: monospace; font-style: normal; font-variant: normal; font-weight: normal; font-size: 1em; line-height: 1.2em; font-size-adjust: none; font-stretch: normal; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; vertical-align: top;">
						<span style="color: rgb(0, 153, 0);">}</span><span style="color: rgb(0, 153, 0);">)</span><span style="color: rgb(0, 153, 0);">(</span>jQuery<span style="color: rgb(0, 153, 0);">)</span>;</div>
</li>
</ol></div>
</p></div>
</div>
<p>
	&nbsp;</p>
<p>
	To add the &quot;one&quot; shorthand methods, we can repeat lines 8&ndash; 9, using <code>one</code> in place of both <code>un</code> in line 8 and <code>unbind</code> in line 9.</p>
]]></content:encoded>
			<wfw:commentRss>http://steelebranding.com/2009/10/28/shorthand-methods-for-unbind-in-jquery/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

