<?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>Terrysco&#039;s Blog &#187; jquery</title>
	<atom:link href="http://www.terrysco.com/node/tag/jquery/feed" rel="self" type="application/rss+xml" />
	<link>http://www.terrysco.com</link>
	<description>仅关注于互联网行业， Linux平台开发。</description>
	<lastBuildDate>Sat, 05 Nov 2011 21:24:06 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>jQuery, working with PHP</title>
		<link>http://www.terrysco.com/node/jquery-working-with-php.html</link>
		<comments>http://www.terrysco.com/node/jquery-working-with-php.html#comments</comments>
		<pubDate>Mon, 11 Oct 2010 19:12:38 +0000</pubDate>
		<dc:creator>terrysco</dc:creator>
				<category><![CDATA[Book Remarks]]></category>
		<category><![CDATA[Javascript/jQuery]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[php]]></category>

		<guid isPermaLink="false">http://www.terrysco.com/?p=365</guid>
		<description><![CDATA[5年前，我刚刚学习PHP这们编程语言的时候，我就放弃了学习很多前端技术，比如javascript和css。总是把所有精力放在服务器端的配置，开发和数据库的设计以及优化上。五年时间过去后，唯一的收获是对服务器端技术比较熟悉，但是开发出来的应用总是感觉缺少点什么。再后来发现了前端技术的重要性，因为前端技术的可优化余地要远远大于后端。于是恶补了一大堆js和css的优化和浏览器的工作行为理论。但越来越发觉自己做出来的应用“难以使用”了，我相信很多服务端技术开发的朋友跟我有同样的感觉。 首先，由于我们缺乏对javascript的熟练编写，导致一个应用很多时候都是借助服务器端完成（以下都以PHP为例），也就是说用户的浏览器只是在GET和POST数据，然后渲染HTML，很少用客户端来进行计算和交互，最多只是用来检测下表单的合法性。记得四年前开发一个CMS的时候，用javascript写了大量的代码，至今想起来犹如梦魇。那时对javascript很不了解，用PHP的思维去使用它，造成代码冗长，难以维护，加上自己调试能力不好，每次做bug修复的时候都想告别这个行业。08年初，在使用Drupal这个CMS的时候，意外看到了jQuery这个框架，是内置在Drupal中的，默认自动加载。为了编写好很多ajax应用，啃了几天jquery cookbook，算是入门了，后来也闲置了。最多就是写一些简单的ajax应用和前台效果。前几天看了一本书《jQuery with PHP》，09年10月份出版的，面向的主要读者就是做服务端开发，对前端知识比较少了解的人。200多页比较精简，语言通俗易懂，看完后收获颇多，从书中摘取一些比较有意思的东西分享给大家。（附上个人翻译，有误的地方欢迎拍转）我想这本书是对一个PHP工程师来说，平衡前后端能力，提高产品的用户体验，节省网络带宽，提高应用性能的重要一课。 It would be silly if a 3D screen was generated on the server and was sent to the client 24 times per second. And it would be awkward if you tried to do something like walk through a wall, and had to wait for the server to decide if it [...]]]></description>
			<content:encoded><![CDATA[<p>5年前，我刚刚学习PHP这们编程语言的时候，我就放弃了学习很多前端技术，比如javascript和css。总是把所有精力放在服务器端的配置，开发和数据库的设计以及优化上。五年时间过去后，唯一的收获是对服务器端技术比较熟悉，但是开发出来的应用总是感觉缺少点什么。再后来发现了前端技术的重要性，因为前端技术的可优化余地要远远大于后端。于是恶补了一大堆js和css的优化和浏览器的工作行为理论。但越来越发觉自己做出来的应用“难以使用”了，我相信很多服务端技术开发的朋友跟我有同样的感觉。</p>
<p>首先，由于我们缺乏对javascript的熟练编写，导致一个应用很多时候都是借助服务器端完成（以下都以PHP为例），也就是说用户的浏览器只是在GET和POST数据，然后渲染HTML，很少用客户端来进行计算和交互，最多只是用来检测下表单的合法性。记得四年前开发一个CMS的时候，用javascript写了大量的代码，至今想起来犹如梦魇。那时对javascript很不了解，用PHP的思维去使用它，造成代码冗长，难以维护，加上自己调试能力不好，每次做bug修复的时候都想告别这个行业。08年初，在使用Drupal这个CMS的时候，意外看到了jQuery这个框架，是内置在Drupal中的，默认自动加载。为了编写好很多ajax应用，啃了几天jquery cookbook，算是入门了，后来也闲置了。最多就是写一些简单的ajax应用和前台效果。前几天看了一本书《jQuery with PHP》，09年10月份出版的，面向的主要读者就是做服务端开发，对前端知识比较少了解的人。200多页比较精简，语言通俗易懂，看完后收获颇多，从书中摘取一些比较有意思的东西分享给大家。（附上个人翻译，有误的地方欢迎拍转）我想这本书是对一个PHP工程师来说，平衡前后端能力，提高产品的用户体验，节省网络带宽，提高应用性能的重要一课。</p>
<p><a href="http://www.terrysco.com/wp-content/uploads/2010/10/jquery-with-php.png"><img class="size-medium wp-image-377 alignright" title="jquery-with-php" src="http://www.terrysco.com/wp-content/uploads/2010/10/jquery-with-php-222x300.png" alt="jquery-with-php" width="222" height="300" /></a></p>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 142px; width: 1px; height: 1px; overflow-x: hidden; overflow-y: hidden;">It would be silly if a 3D screen was generated on the server and was sent to the client</div>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 142px; width: 1px; height: 1px; overflow-x: hidden; overflow-y: hidden;">24 times per second. And it would be awkward if you tried to do something like</div>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 142px; width: 1px; height: 1px; overflow-x: hidden; overflow-y: hidden;">walk through a wall, and had to wait for the server to decide if it was allowed or not.</div>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 142px; width: 1px; height: 1px; overflow-x: hidden; overflow-y: hidden;">However, in a pure PHP environment, that&#8217;s exactly what has been happening—the</div>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 142px; width: 1px; height: 1px; overflow-x: hidden; overflow-y: hidden;">server generates absolutely everything that the client displays. If an element needs</div>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 142px; width: 1px; height: 1px; overflow-x: hidden; overflow-y: hidden;">to be removed from a table, for example, then the server needs to be told, so that it</div>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 142px; width: 1px; height: 1px; overflow-x: hidden; overflow-y: hidden;">can give the client the new view. If you try to do something illegal, such as submit a</div>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 142px; width: 1px; height: 1px; overflow-x: hidden; overflow-y: hidden;">blank form where an email address is required, then pure PHP applications will let</div>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 142px; width: 1px; height: 1px; overflow-x: hidden; overflow-y: hidden;">you do that, wasting time and server resources.</div>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 142px; width: 1px; height: 1px; overflow-x: hidden; overflow-y: hidden;">However, using JavaScript, and especially using Ajax, the client side is no longer a</div>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 142px; width: 1px; height: 1px; overflow-x: hidden; overflow-y: hidden;">“dumb terminal” for the server. We can write applications fully on the client side, if</div>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 142px; width: 1px; height: 1px; overflow-x: hidden; overflow-y: hidden;">we wish, using the server purely as a database. This book will demonstrate ways to</div>
<div id="_mcePaste" style="position: absolute; left: -10000px; top: 142px; width: 1px; height: 1px; overflow-x: hidden; overflow-y: hidden;">work towards that.</div>
<p>It would be silly if a 3D screen was generated on the server and was sent to the client 24 times per second. And it would be awkward if you tried to do something like walk through a wall, and had to wait for the server to decide if it was allowed or not.</p>
<p>（这里用网游来比喻前端和后端的关系，很多程序员都玩网游吧！）</p>
<p>如果3D效果的显示数据是在服务端生成后以每秒24次的频率发送给客户端，可想这种设计有多傻。同样，如果你试着做一些很常见的操作，比如准备穿越一道墙，如果这个时候还要等待服务器来判断是否允许的话同样很傻，客户端做这个事情是最合适的。</p>
<p>However, in a pure PHP environment, that&#8217;s exactly what has been happening—the server generates absolutely everything that the client displays. If an element needs to be removed from a table, for example, then the server needs to be told, so that it can give the client the new view. If you try to do something illegal, such as submit a blank form where an email address is required, then pure PHP applications will let you do that, wasting time and server resources.</p>
<p>然而，在单独的PHP环境中，服务端产生几乎所有客户端要显示的东西。比如要从一个HTML表格中删除一个元素，必须通知服务器，这样服务端才能生成新的页面发送给客户端。如果你做了一些非法操作，比如没有填写重要的邮件地址就提交了一个空的表单，只有提交后PHP才能知道，这样大大浪费了时间和宝贵的服务器资源。</p>
<p>However, using JavaScript, and especially using Ajax, the client side is no longer a ”dumb terminal” for the server. We can write applications fully on the client side, if we wish, using the server purely as a database. This book will demonstrate ways to work towards that.</p>
<div>然而，使用Javascript，特别是Ajax，对服务器来说客户端不再是一个“哑终端”。我们完全可以在客户端编写一些应用程序，如果我们愿意，服务端完全可以作为一个数据库来使用。</div>
]]></content:encoded>
			<wfw:commentRss>http://www.terrysco.com/node/jquery-working-with-php.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>drupal中使用thickbox</title>
		<link>http://www.terrysco.com/node/drupal-jquery-thickbox.html</link>
		<comments>http://www.terrysco.com/node/drupal-jquery-thickbox.html#comments</comments>
		<pubDate>Fri, 14 Nov 2008 20:05:19 +0000</pubDate>
		<dc:creator>terrysco</dc:creator>
				<category><![CDATA[CMS/FrameWork]]></category>
		<category><![CDATA[drupal]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[thickbox]]></category>

		<guid isPermaLink="false">http://www.anyliv.com/www.terrysco.com/?p=59</guid>
		<description><![CDATA[<p>thickbox是jquery的一个插件，并且drupal已经内置了jquery，使用起来很方便。</p><p>我们可以使用thickbox做一个弹出div层的效果，大大改善了用户体验，并且页面无需跳转，可操作性也得到了提高。使用thickbox需要注意的是在链接属性里面加上'thickbox'的class属性，然后地址跟上一些大小参数（宽和高），也就是弹出div层的宽和高，在l函数中可以很方便做到这个。</p><p>首先我们要加载三个文件，一个是thickbox的js文件，官方有压缩版本的，另一个是css文件，用来渲染效果的，最后一个就是一个临时的gif文件，在加载的时候有个临时效果，类似滚动效果。然后在我们的模块中写入类似下面的代码：</p><p>...</p>
]]></description>
			<content:encoded><![CDATA[<p>thickbox是jquery的一个插件，并且drupal已经内置了jquery，使用起来很方便。</p>
<p>我们可以使用thickbox做一个弹出div层的效果，大大改善了用户体验，并且页面无需跳转，可操作性也得到了提高。使用thickbox需要注意的是在链接属性里面加上&#8217;thickbox&#8217;的class属性，然后地址跟上一些大小参数（宽和高），也就是弹出div层的宽和高，在l函数中可以很方便做到这个。</p>
<p>首先我们要加载三个文件，一个是thickbox的js文件，官方有压缩版本的，另一个是css文件，用来渲染效果的，最后一个就是一个临时的gif文件，在加载的时候有个临时效果，类似滚动效果。然后在我们的模块中写入类似下面的代码：</p>
<p>if ($user-&gt;uid) {<br />&nbsp;&nbsp;&nbsp; $output .= l(t(&#8216;reply&#8217;), &#8216;test/reply/&#8217; .$row-&gt;cid, array(&#8216;class&#8217; =&gt; &#8216;thickbox&#8217;), &#8216;height=200&amp;width=400&#8242;);<br />&nbsp;}</p>
<p>其中l函数的地一个参数为链接显示的名字，第二个参数为链接地址，第三个参数为联合数组，这里我们指定了class为thickbox，第四个参数为查询字符串，我们指定了宽和高，这样l函数生成的整个链接地址就是：</p>
<p><span class="nodeLabelBox repTarget">&lt;<span class="nodeTag">a</span><span class="nodeAttr editGroup">&nbsp;<span class="nodeName editable" collapsed="false">class</span>=&quot;<span class="nodeValue editable" collapsed="false">thickbox</span>&quot;</span><span class="nodeAttr editGroup">&nbsp;<span class="nodeName editable" collapsed="false">href</span>=&quot;<span class="nodeValue editable">/drupal2/test/reply/19?height=200&amp;width=400</span>&quot;</span><span class="nodeBracket editable insertBefore">&gt;</span><span class="nodeText editable">回复</span>&lt;/<span class="nodeTag">a</span>&gt;</span></p>
<p><span class="nodeLabelBox repTarget">点击这个链接后即可得到我们需要的效果。</span></p>
<p><span class="nodeLabelBox repTarget">另外，要想弹出一个表单，很简单，定义一个表单函数：</span></p>
<p><span class="nodeLabelBox repTarget">function chisha_reply_form($cid) {<br />&nbsp; $form['cid'] = array(&#8216;#type&#8217; =&gt; &#8216;value&#8217;, &#8216;#value&#8217; =&gt; $cid);<br />&nbsp; $form['content'] = array(&#8216;#title&#8217; =&gt; &#8216;我要回复&#8217;, &#8216;#type&#8217; =&gt; &#8216;textarea&#8217;, &#8216;#rows&#8217; =&gt; 5);<br />&nbsp; $form['submit'] = array(&#8216;#type&#8217; =&gt; &#8216;submit&#8217;, &#8216;#value&#8217; =&gt; &#8216;留言&#8217;);<br />&nbsp; return $form;<br />}</span></p>
<p><span class="nodeLabelBox repTarget">然后在reply映射的函数中：</span></p>
<p><span class="nodeLabelBox repTarget">if ($cid) {<br />&nbsp;&nbsp;&nbsp; print drupal_get_form(&#8216;chisha_reply_form&#8217;, $cid);<br />}<br />exit();</span></p>
<p>这里一定要使用exit，而不能用return，要不然整个页面都会返回。类似ajax功能中的drupal_to_js()后的exit。</p>
<p>PS. 同事买了那本汉化的jquery教程，最近有空研读下，证明给大家看，只要有好的工具，开发人员也可以写出很漂亮，绚丽的界面和操作方法。</p>
]]></content:encoded>
			<wfw:commentRss>http://www.terrysco.com/node/drupal-jquery-thickbox.html/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>

