jQuery 重製表單(reset)的方法

今天copy之前的項目的部分代碼到新項目時,遇到了$("#..Form").get(0).reset();這行代碼,我一開始以為這是多次一舉的,既然已經用ID選擇器了,得到的肯定是一個Form了,而不是包含其他Form的數組了。所以直接寫成$("#..Form").reset()不就完事了嘛。但我錯了,我居然忽略了兩點: 
1.ID選擇器的返回值類型是Array<Element>,也就是說也是數組形式的,雖然現在xhtml提倡的標準中,id是提倡唯一的,但jquery肯定是考慮到了兼容。 
2.reset()是js中的方法,而我一直在把它當作jquery的方法使用。這裡有一個注意:通過jquery中get(0)與eq(0)的返回值是不一樣的,前者返回值是Element後者是jQuery,所以要先get(0)再reset(),如果先eq (0)再reset()是報錯的。 

 ————————————————-
get() 跟 eq()不同

 get()返回如同陣列的html, 例如$("form").get(0)代表form原素的第一個form

eq()返回的是jq元素

JavaScript 獲取頁面高度(多種瀏覽器)

function getInfo()
{
var s = "";
s += " 網頁可見區域寬:"+ document.body.clientWidth;
s += " 網頁可見區域高:"+ document.body.clientHeight;
s += " 網頁可見區域寬:"+ document.body.offsetWidth + " (包括邊線和捲軸的寬)";
s += " 網頁可見區域高:"+ document.body.offsetHeight + " (包括邊線的寬)";
s += " 網頁正文全文寬:"+ document.body.scrollWidth;
s += " 網頁正文全文高:"+ document.body.scrollHeight;
s += " 網頁被卷去的高(ff):"+ document.body.scrollTop;
s += " 網頁被卷去的高(ie):"+ document.documentElement.scrollTop;
s += " 網頁被卷去的左:"+ document.body.scrollLeft;
s += " 網頁正文部分上:"+ window.screenTop;
s += " 網頁正文部分左:"+ window.screenLeft;
s += " 螢幕解析度的高:"+ window.screen.height;
s += " 螢幕解析度的寬:"+ window.screen.width;
s += " 螢幕可用工作區高度:"+ window.screen.availHeight;
s += " 螢幕可用工作區寬度:"+ window.screen.availWidth;
s += " 你的螢幕設置是 "+ window.screen.colorDepth +" 位彩色";
s += " 你的螢幕設置 "+ window.screen.deviceXDPI +" 像素/英寸";
//alert (s);
}

*—————————————————-*
 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

在IE中:

document.body.clientWidth ==> BODY對象寬度 document.body.clientHeight ==> BODY對象高度 document.documentElement.clientWidth ==> 可見區域寬度 document.documentElement.clientHeight ==> 可見區域高度

在FireFox中:

document.body.clientWidth ==> BODY對象寬度

document.body.clientHeight ==> BODY對象高度

document.documentElement.clientWidth ==> 可見區域寬度

document.documentElement.clientHeight ==> 可見區域高度

在Opera中:

document.body.clientWidth ==> 可見區域寬度

document.body.clientHeight ==> 可見區域高度

document.documentElement.clientWidth ==> 頁面對象寬度(即BODY對象寬度加上Margin寬) document.documentElement.clientHeight ==> 頁面對象高度(即BODY對象高度加上Margin高)

而如果沒有定義W3C的標準,則 IE為:

document.documentElement.clientWidth ==> 0

document.documentElement.clientHeight ==> 0

FireFox為:

document.documentElement.clientWidth ==> 頁面對象寬度(即BODY對象寬度加上Margin寬)

document.documentElement.clientHeight ==> 頁面對象高度(即BODY對象高度加上Margin高)

Opera為:

document.documentElement.clientWidth ==> 頁面對象寬度(即BODY對象寬度加上Margin寬)

document.documentElement.clientHeight ==> 頁面對象高度(即BODY對象高度加上Margin高)

from :
http://www.dotblogs.com.tw/aquarius6913/archive/2011/01/03/20538.aspx 

jQuery Masonry 磚牆效果 (如pinterest.com的瀑布效果 )

下載處:
http://masonry.desandro.com/

 這是屬於jQuery 的外掛

利用

<code class="javascript" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font:inherit;vertical-align:baseline;font-family:Monaco, monospace;"><span class="kd" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#a9d866;">var</span> <span class="nx" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;">$boxes</span> <span class="o" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#ff6633;">=</span> <span class="nx" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;">$</span><span class="p" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#eeddbb;">(</span><span class="s1" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#78bd55;">&#39;&lt;div class=&quot;box&quot;/&gt;&lt;div class=&quot;box&quot;/&gt;&lt;div class=&quot;box&quot;/&gt;&#39;</span><span class="p" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#eeddbb;">);</span>
<span class="nx" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;">$</span><span class="p" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#eeddbb;">(</span><span class="s1" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#78bd55;">&#39;#container&#39;</span><span class="p" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#eeddbb;">).</span><span class="nx" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;">append</span><span class="p" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#eeddbb;">(</span> <span class="nx" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;">$boxes</span> <span class="p" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#eeddbb;">).</span><span class="nx" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;">masonry</span><span class="p" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#eeddbb;">(</span> <span class="s1" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#78bd55;">&#39;appended&#39;</span><span class="p" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#eeddbb;">,</span> <span class="nx" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;">$boxes</span> <span class="p" style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-color:initial;font-size:12px;font:inherit;vertical-align:baseline;color:#eeddbb;">);</span></code>

可以動態增加元素
參考:
http://masonry.desandro.com/docs/methods.html#appended 

 
 

PHP if else 縮寫

$a = 0;

$a == 1 ? "a":"b";
可以 return 
$a == 1 ? "a":"b"; 

也可以 echo 
$a == 1 ? "a":"b"; 

也可以 $string = ($a == 1 ? "a":"b"); 

因為不常用,但最近寫很多function裡面的時候可以用這種方式

在一般判斷的時候其實不太建議用這種寫法。
例如當遇到多個巢狀迴圈判斷,或每件判斷都要使用不同的執行碼,用這種寫法不容易理解。
我個人只用在function 裡面 

<?

class XX {

    function test($val){

//程式碼


  return $val=="A"? 1 : 0; //回傳布林值
/*
本來寫法是
if($val == 1) return 1;
return 0;
*/
 
}
     } 
$XX = new XX;
echo $XX->test("C");
?>

Picasa 相簿容量

<h1 style="color:#dd4b39;display:inline-block;float:left;font-family:Arial, sans-serif;font-size:20px;font-weight:normal;min-width:156px;vertical-align:top;line-height:normal;white-space:nowrap;">Picasa 及 Picasa 網路相簿

網址:
https://support.google.com/picasa/bin/answer.py?hl=zh-Hant&answer=1224181 

<h2 style="font-family:Arial;font-size:20px;font-weight:normal;line-height:24px;margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0.5em;padding-bottom:0px;padding-left:0px;display:inline;float:left;">免費儲存空間限制</h2>

「Picasa 網路相簿」提供 1 GB 的免費儲存空間供您存放相片和影片,但是大小低於特定限制的檔案不會計入這個免費儲存空間配額限制。如果您使用的其他 Google 產品 (包括 Blogger、Google+ 和「Google 地圖」) 可將相片和影片儲存在「Picasa 網路相簿」中,也同樣適用這項限制。

免費儲存空間大小的相片適合在網路上分享;不過,如果為了保存或列印等因素而需要較佳的圖片品質,因此必須上載較大的圖檔,您隨時都可以購買更多儲存空間瞭解詳情

如果您已申請使用 Google+

<h4>免費儲存空間限制</h4>

只要相片大小低於 2048x 2048 像素,影片長度少於 15 分鐘,就不會計入免費儲存空間配額。

<h4>自動調整大小</h4>

Google+ 會自動將所有上載的相片長邊調整為 2048 像素,並且不會計入免費儲存空間配額。

而所有從 Picasa 軟體上載的相片或「Picasa 網路相簿」中的相片一旦超過免費的大小上限,就會計入 1 GB 的免費儲存空間。儲存空間快要用完時,您上載的相片只要超過大小限制,系統就會自動將相片的長邊調整為 2048 像素。

如果您尚未申請使用 Google+

<h4>免費儲存空間限制</h4>

只要相片大小低於 800x 800 像素,影片長度少於 15 分鐘,就不會計入免費儲存空間配額。

<h4>自動調整大小</h4>

所有上載的相片一旦超過免費的大小上限,就會計入 1 GB 的免費儲存空間。您的儲存空間快要用完時,您上載到「Picasa 網路」的相片只要超過大小限制,系統就會自動將相片的長邊調整為 800 像素。

注意:如果您從 Picasa 桌面軟體上載相片時儲存空間已用完,必須將相片調整為免費儲存大小才能上載。系統不會將超過大小限制的上載相片自動調整為免費儲存空間限制適用的大小。

</h1>