您好,登錄后才能下訂單哦!
這次幫老師做了一個銀行的積分系統,我主要負責前臺的頁面開發,采用了Html和jquery,在使用jquery的時候,還主要用了easyui和datatable等控件,第一次將自己自學的東西用到了實踐中,還是有些收獲的,現記錄如下:
主要是分為JQuery的一些細節注意問題,easyui使用的時候一些問題,datatable使用的問題和json數據格式傳輸。
先寫一些JQuery和頁面設計的時候的一些細節吧:
我們開發的時候,先是用mockups畫草圖,然后具體寫html頁面,由于希望有好的響應速度,所以沒有再繼續轉換為jsp頁面,所以自己寫js代碼實現數據傳輸。
Html的一些細節:現在貌似都不流行用table來設置界面布局,都是用div來包裹一些具體的input,select,label,a,然后通過div的id,class調整css,然后我的習慣是調整css都是用class屬性,獲取元素,然后繼續獲取元素屬性。
因為用到了easyui,它自帶了很多css樣式,所以可以直接引用,只要設置class='easyui-linkbutton',這是針對超鏈接的。
然后我習慣的書寫js代碼都是通過一個獨立的文件,設置與html頁面同名的js文件,在這寫針對這個頁面的js代碼,通過html的引用即可,如果使用myeclipse編寫代碼的話,可以按住ctrl+鼠標移動到具體函數或是超鏈接上,雙擊,單擊,能找到具體函數,或是js文件就說明鏈接沒有出錯,可以防止一些函數名,js引用出錯。
下面說一些具體的js代碼吧。
1 var XX = $('#id').val();//最一般的獲取元素value值 2 var XX = $('#id').attr('value');//這種方式也可以 3 $('#id').attr("checked", true); //設置checkbox是否已選 4 $('#id').attr("disabled", false);//設置input是否可用
上面幾個是最簡單的獲取元素屬性,接下來給幾個適用于easyui里的
var productid = $('#productId').combobox('getValue'); //easyui里的combobox屬性獲取必須用.combobox('getValue') $('#productId').combobox('setValue','12'); //這個是設置easyui下的combobox屬性 var startDate2 = $("#startdate2").datebox("getValue"); //easyui下的databox,同combobox
提到了databox就不得不說一下,因為它顯示的外國的日期格式顯示,如果想設置為我們的日期格式顯示的話,只需要調用easyui/locale/easyui-lang-zh_CN.js就可以了,當初還試了很多方法,結果網上找到的,他們外國考慮的的卻很全面撒。。
接下來說說js里面的變量問題吧,很多面試題有過,看代碼吧:
data =1; function check(){ var data = 2; alert(data); test(); } function test(){ alert(data); }
顯示結果為2,1
1 var data =1; 2 function check(){ 3 var data = 2; 4 alert(data); 5 test(); 6 } 7 function test(){ 8 alert(data); 9 }
顯示結果為2,1
1 var data =1; 2 function check(){ 3 data = 2; 4 alert(data); 5 test(); 6 } 7 function test(){ 8 alert(data); 9 }
顯示結果為2,2
其實很容易區分的啦,除了在函數段里,用var聲明的變量為局部變量,其他都是全局變量。
好了,接下來說說我的一些習慣,js代碼中都是用''單引號來引用ID,class,如果頁面加載的時候需要執行一些函數就
$(document).ready(function(){ });
接下來能說的只有JQuery的ajax函數,超級好用哎,很方便
$.ajax({ url:'XXXX.action',//replace with real dealing action type: 'post', data: "submitData=" + sendData, async: false, datatype:'json', success: function(data){ } });
我們用的都是json傳輸數據格式。
差不多了,在接下來的文章中再說其他的吧,可能有些地方漏掉了,再補充。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。