一.網站地圖與模塊設計

網站地圖又名SITE MAP,站點地圖呈現樹狀結構，以主頁為樹的跟節點，站點地圖采用樹狀結

構的優點是可以讓我們對我們的產品整體模塊和不同欄目、功能單元有一個清晰的認識。

網站地圖分為扁平化模塊的網站地圖，還有縱向深入型，還有復雜深度型。

網站地圖一般分2種，一種是給捜索引擎看的，一種是給用戶看的，前者幫助捜索引擎更好地

收錄你的網站，后者幫助用戶更好的了解你的網站整體結構、更快的找到他們想要找的內容。

二.網頁常見控件類型

1.控件尺寸，常見網頁UI控件包括：

Label （標簽）、ScrollView （滾動視圖）、ScrollBar （滾動條）和 Mask （遮罩）。

Button （按鈕）、ProgressBar （進度條）、EditBox （輸入框）、CheckBox （復選

框）、Image （圖片）、List （列表）、Menu （菜單）、navigation （導航）、Tab （選

項卡）、toast （提示）、alert （警示提示）、dialog （對話框）、Divider （分割線）、

timepicker （時間選擇器）等。

各類網頁UI控件還會自帶樣子，我們可以為同樣的功能設計多種樣式，舉例時間選擇器。

2.頁面操作還會觸發事件，例如；

按鈕屬性用于設置當按鈕處在

普通（Normal）、按下（Pressed）,懸停（Hover）、禁用（Disabled）四種狀態。

toast的消息提示分類一共有三種類型：成功類、失敗類、常規類。

3.網頁端表單的五種操作狀態：

標簽一輸入框一反饋一動作一幫助

(1)標注一提示當前表單是做什么的

(2)輸入框一用來輸入信息的

(3)反箴一用戶做了動作之后，界面回饋用戶的信息

(4)動作一表單中的按鈕，幫助人機操作的按鍵

(5)幫助一輔助用戶了解用戶功能的信息

4.反饋信息的類型：

A.push指的是系統的通知，從下到上彈出。

B.toast自己出現，自己消失，時間只有1秒，文字簡短只有一行。

C.Tips是APP內部，或者網站內部，由頂部往下而來的通知。

Tips可以系統關閉，push-般不能。

D.下拉菜單和邊欄，一般采取遞進形式，每層級只一個關鍵字段信息。

E.Disable狀態的提示（可點擊狀態，用顏色的灰度，告訴UI或者研發是不可用的。）

三.網頁常見事件

1.UI事件：當用戶與頁面上的元素交互時觸發。

?焦點事件：當元素獲得或失去焦點時觸發。

?鼠標事件：當用戶通過鼠標在頁面上執行操作時觸發。

?滾輪事件：當使用鼠標滾輪時觸發。

?文本事件：當在文檔中輸入文本時觸發。

?鍵盤事件：當用戶通過鍵盤在頁面上執行操作時觸發。

2.變動事件：當底層DOM結構發生變化時觸發

?load：當頁面完全加載后在window上面觸發；當所有框架都加載完畢時在框架集上面觸

發；當圖像加載完畢時在＜img＞上面觸發；或者當嵌入的內容加載完畢時在＜ object＞元素

上面觸發。

?unload：當頁面完全卸載后在window上面觸發；當所有框架卸載后在框架集上面觸發；或

者當嵌入的內容且在完畢后在＜object＞元素上觸發。

?abort：在用戶停止下載過程時，如果嵌入的內容沒有加載完，則在＜object＞元素上觸發。

?error：當發生javascript錯誤時在window上觸發，當無法加載圖像時在＜img＞元素上觸

發，當無法加載嵌入內容時在＜ object內容上觸發。

?select：當用戶選擇文本框(＜ input＞或＜textarea＞)中的一或多個字符時觸發。

?resize：當窗口或框架的大小變化時在window或框架上面觸發。

?scroll：當用戶滾動帶滾動條的元素中的內容時，在該元素上面觸發。

?當焦點從頁面的一個元素移動到另一個元素，會依次觸發下列事件：

?focusout：在失去焦點的元素上觸發

?focusin：在獲得焦點的元素上觸發

?blur：在失去焦點的元素上觸發

?focus：在獲得焦點的元素上觸發

總結

以上是生活随笔為你收集整理的extjs年月日时分选择控件_UI设计|网站公共控件及交互事件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。