天天看點

很有用的Jquery代碼片段(轉)

大家可能在表單的操作中需要防止使用者意外的送出表單,那麼下面這段代碼肯定非常有幫助:

<a href="http://223.4.150.152/gb/debug/bc1d5165-d952-4f60-80cf-01609df7c256.htm" target="_blank">線上調試</a>

<a href="http://223.4.150.152/gb/networks/uploads/b7819361-e872-4502-8697-9d727ffb603a/code1.html" target="_blank">線上示範</a>

可能針對不同的表單形式,你需要調用不同類型的清楚方法,不過使用下面這個現成方法,絕對能讓你省不少功夫。

<a href="http://223.4.150.152/gb/debug/796c8b47-198c-41fe-bbc0-2add95b0f1f3.htm" target="_blank">線上調試</a>

<a href="http://223.4.150.152/gb/networks/uploads/b7819361-e872-4502-8697-9d727ffb603a/code2.html" target="_blank">線上示範</a>

下面的代碼對于ajax操作非常有用,你可以有效的避免使用者多次送出資料,個人也經常使用:

<a href="http://223.4.150.152/gb/debug/acafc73f-38ef-4ee5-8531-91e1914c9c33.htm" target="_blank">線上調試</a>

<a href="http://223.4.150.152/gb/networks/uploads/b7819361-e872-4502-8697-9d727ffb603a/code3.html" target="_blank">線上示範</a>

禁用按鈕:

啟動按鈕:

可能大家往往會使用.attr(‘disabled',false);,不過這是不正确的調用。

這個代碼和上面類似,都屬于幫助使用者控制表單遞交按鈕。使用這段代碼後,遞交按鈕隻有在使用者輸入指定内容後才可以啟動。

<a href="http://223.4.150.152/gb/debug/e21e22a3-6505-4c33-b30e-e92bca6fd21c.htm" target="_blank">線上調試</a>

<a href="http://223.4.150.152/gb/networks/uploads/b7819361-e872-4502-8697-9d727ffb603a/code4.html" target="_blank">線上示範</a>

多次遞交表單對于web應用來說是個比較頭疼的問題,下面的代碼能夠很好的幫助你解決這個問題:

<a href="http://223.4.150.152/gb/debug/c9f023bc-4048-4d1a-bc79-cd36bc818ae4.htm" target="_blank">線上調試</a>

<a href="http://223.4.150.152/gb/networks/uploads/b7819361-e872-4502-8697-9d727ffb603a/code5.html" target="_blank">線上示範</a>

有時候你需要提示使用者目前操作的輸入框,你可以使用下面代碼高亮顯示标示:

<a href="http://223.4.150.152/gb/debug/cb672573-0002-4b1a-9976-0116fa6f106f.htm" target="_blank">線上調試</a>

<a href="http://223.4.150.152/gb/networks/uploads/b7819361-e872-4502-8697-9d727ffb603a/code6.html" target="_blank">線上示範</a>

這個方法可以幫助你動态的添加表單中的元素,比如,input等:

<a href="http://223.4.150.152/gb/debug/be24174b-08a6-4029-826e-5c5f80d5d8ff.htm" target="_blank">線上調試</a>

<a href="http://223.4.150.152/gb/networks/uploads/b7819361-e872-4502-8697-9d727ffb603a/code7.html" target="_blank">線上示範</a>

下面代碼能夠使用ajax資料自動生成選擇框的内容

<a href="http://223.4.150.152/gb/debug/1ffcde94-f05c-4dbd-828b-e8533781c08c.htm" target="_blank">線上調試</a>

<a href="http://223.4.150.152/gb/networks/uploads/b7819361-e872-4502-8697-9d727ffb603a/code8.html" target="_blank">線上示範</a>

代碼很簡單,如下:

<a href="http://223.4.150.152/gb/debug/81a81e0f-6f64-469c-ad1c-3a761edf090c.htm" target="_blank">線上調試</a>

<a href="http://223.4.150.152/gb/networks/uploads/b7819361-e872-4502-8697-9d727ffb603a/code9.html" target="_blank">線上示範</a>

希望大家覺得這些jQuery代碼會對你的開發有幫助,如果你也有類似的代碼,請和我們分享!

繼續閱讀