PHP網站開發(fā)項目式教程-分頁瀏覽收郵件

任務八接收、閱讀、刪除郵件分頁瀏覽郵件打開并閱讀郵件刪除郵件8.1分頁瀏覽郵件實現(xiàn)收件箱基本功能三個知識點收件箱頁面布局說明收件箱郵件總數(shù)查詢方法說明獲取并顯示收件箱郵件總數(shù)收件箱頁面運行效果點擊email.php頁面中左側的“收信”或者“收件箱”超鏈接時，要從右側的浮動框架子窗口中顯示右圖所示的頁面運行效果8.1.4分頁瀏覽郵件在眾多的動態(tài)頁面中，要瀏覽保存在數(shù)據(jù)庫中的大量數(shù)據(jù)，都需要使用分頁瀏覽技術，例如一個留言板下面的數(shù)千條留言、郵箱中的數(shù)千封郵件等等，使用分頁瀏覽技術之后，無論數(shù)據(jù)量怎樣變化，都能保證頁面的長度不會發(fā)生任何變化，變化的只有頁數(shù)，只要用戶點擊進入自己需要的頁面查閱信息即可。收件箱頁面布局需要創(chuàng)建的文件需要創(chuàng)建的文件有樣式文件receiveemail.css和頁面文件receiveemail.php，在頁面文件中引用樣式文件。收件箱頁面的頁面邊距要定義為0（需要在receiveemail.css文件中增加樣式代碼body{margin:0;}）盒子div1的樣式要求盒子div1的樣式要求如下：寬度為自動，高度為25px，上下填充為0，左右填充為10px，邊距是0，盒子中文本字號為10pt，文本的行高是25px獲取并顯示收件箱中的郵件總數(shù)內容設計步驟設計這一部分內容需要通過如下幾個操作步驟來實現(xiàn)：第一步，啟用session，獲取$_SESSION數(shù)組中存儲的登錄賬號信息，并在后面連接上@163.com，為設計查詢條件做好準備；第二步，連接打開數(shù)據(jù)庫，查詢表emailmsg列receiver中包含當前登錄賬號且沒有被刪除的郵件信息第三步，獲取查詢結果記錄集中的記錄數(shù)，即為當前用戶收件箱中的郵件總數(shù)，在div1內部輸出。查詢條件分析獲取當前登錄賬號收件箱中郵件總數(shù)時需要使用的查詢語句中條件比較復雜，假設有四封郵件的收件人receiver列值分別如下：第一封：zhangmanyu@163.com;linqingxia@163.com;wangzuxian@163.com;第二封：linqingxia@163.com;gaoyuany@163.com;第三封：xglinqingxia@163.com;linqingxiamv@163.com;第四封：meinan@163.com;xglinqingxia@163.com;思考問題：設變量$uname的內容是linqingxia@163.com，如何設置條件，保證正確查到第一封和第二封郵件？能否直接使用receiverlike‘%$uname%’，為什么？使用receiverlike‘%$uname%’將獲取到這四封郵件，不符合要求，所以不可使用查詢條件設置方法正確設置方法為：receiverlike'$uname%'orreceiverlike'%;$uname%'即若是要查詢的賬號在所有收件人開始的位置，則通過receiverlike'$uname%'條件一定能夠找到；若要查詢的賬號在中間的某個位置，則通過receiverlike'%;$uname%'一定能夠精確找到。完成div1內容的代碼在receiveemail.php文件中增加如下代碼盒子div2及子元素的樣式要求盒子div2的樣式：寬度自動，高度25像素，上下填充5px，左右填充20px，上下邊距5px，左右邊距0，背景淺灰色#eee，下邊框1像素、實線、顏色#aaf。盒子div2-1的樣式：寬度自動，高度自動，填充是0，邊距是0，向左浮動；使用樣式選擇符.div2-1input定義盒子內的兩個按鈕中顯示的文本字號是10pt。盒子div2-2的樣式：寬度自動，高度自動，填充0，邊距0，向右浮動，文本行高25px，文本字號10pt。刪除和刷新按鈕說明刪除按鈕的功能：在頁面中選擇要刪除的郵件之后，點擊“刪除”按鈕時能夠將郵件設置為已刪除狀態(tài)，該功能需要通過執(zhí)行指定的delete.php文件來完成，該按鈕需要設置為submit類型；點擊刷新按鈕時，要保證在當前窗口中重新運行頁面文件receiveemail.php，目的是若用戶收到了新的郵件，能夠及時刷新頁面（為了降低復雜性，該項目中沒有使用自動刷新顯示新郵件功能），該按鈕需要設置為普通的button按鈕。添加div、刪除和刷新按鈕在receiveemail.php中div1盒子的后面增加div2和內部嵌套的div2-1，添加如下內容：確定每頁中要顯示的記錄數(shù)和郵件的總頁數(shù)每頁中要顯示的記錄數(shù)，直接在代碼中給定即可，例如$pagesize=5;收件箱中的郵件頁數(shù)根據(jù)郵件總數(shù)和每頁中的記錄數(shù)來計算，因為得到的郵件頁數(shù)可能是小數(shù)，所以需要使用函數(shù)ceil()取得不小于該數(shù)的最小整數(shù)。例如，若獲取的記錄總數(shù)$reccount為17，設置的每頁記錄數(shù)$pagesize為5，則兩者相除之后的結果為3.4，使用ceil(3.4)得到的結果是不小于3.4的最小整數(shù)4；在receiveemail.php中獲取到郵件總數(shù)之后插入上面代碼確定當前要顯示郵件信息的頁碼獲取當前要顯示郵件信息的頁碼有兩種情況：剛打開收件箱和點擊換頁超鏈接之后若是用戶剛剛打開收件箱，顯示的應當是第一頁的郵件信息，之后則根據(jù)用戶點擊的“首頁、上頁、下頁、尾頁”超鏈接獲取當前要顯示的郵件信息的頁碼。例如，假設當前正在顯示的是第3頁內容，若點擊“上頁”超鏈接，接下來要顯示的一定是第2頁，這個頁碼數(shù)字將通過點擊超鏈接的方式提交給服務器。確定當前要顯示郵件信息的頁碼例如，假設每個超鏈接都在href屬性中使用鍵名pageno向服務器提交數(shù)據(jù)，要判斷用戶是不是剛剛打開收件箱，需要通過檢測這些超鏈接有沒有向服務器端提交數(shù)據(jù)來實現(xiàn)，若元素$_GET['pageno']存在，說明已經通過點擊超鏈接向服務器提交數(shù)據(jù)了，此時需要獲取元素$_GET['pageno']的數(shù)據(jù)作為當前將要顯示的郵件信息的頁碼，否則當前必須顯示第一頁郵件信息。在receiveemail.php中獲取到總頁數(shù)之后插入該語句設計“首頁、上頁、下頁、尾頁”時的原則若收件箱中郵件頁數(shù)為0，則首頁、上頁、下頁、尾頁都是文本若當前顯示第一頁，則“首頁”設置為普通文本，否則“首頁”為超鏈接，點擊時向服務器提交頁碼1；若當前顯示第一頁，則“上頁”設置為普通文本，否則“上頁”為超鏈接，在點擊時需要向服務器提交的頁碼是當前正在顯示的頁面頁碼減去1；若當前顯示最后一頁，則“下頁”設置為普通文本，否則“下頁”為超鏈接，在點擊時需要向服務器提交的頁碼是當前正在顯示的頁面頁碼加上1；若當前顯示最后一頁，則“尾頁”設置為普通文本，否則設置的“尾頁”超鏈接在點擊時需要向服務器提交的頁碼是總頁數(shù)值。完善div2的代碼獲取當前頁中要顯示記錄（郵件）的起始記錄號查詢當前用戶的郵箱時，若查詢結果記錄集$res中的記錄數(shù)$reccount為17，則系統(tǒng)給定的記錄編號是從0到16的數(shù)列，若每頁顯示的記錄數(shù)$pagesize為5思考問題：當前頁碼與當前頁中第一條記錄編號之間存在著怎樣的關系？即第一頁從哪條開始顯示？第二頁從哪條開始？第三頁？第四頁？第一頁從第0條開始，顯示0~4條第二頁從第5條開始，顯示5~9條第三頁從第10條開始，顯示10~14條第四頁從第15條開始，顯示15~16條當前頁碼與當前頁中第一條記錄編號之間的關系根據(jù)上表中顯示的數(shù)字關系，依據(jù)頁碼獲取當前頁起始記錄編號的公式如下：$pagestart=($pageno-1)*$pagesize在receiveemail.php中獲取到頁碼之后插入該語句獲取當前頁中要顯示的若干條記錄實現(xiàn)這一功能，需要考慮在收件箱中顯示郵件信息時，要將最后收到的郵件排列在第一頁第一條，即要按照收發(fā)郵件的日期進行降序排序，因此設計select語句時，要使用orderby子句按照郵件的收發(fā)日期進行降序排序，使用limit子句設置要獲取記錄的起始編號和記錄數(shù)；在定義的查詢收件箱所有記錄的查詢語句的基礎上增加orderby和limit兩個子句的應用，注意orderby前面一定要保留一個空格，與之前的條件子句分隔開執(zhí)行定義的查詢語句之后，使用變量$result保存查詢結果記錄集。在receiveemail.php中獲取到當前頁起始記錄編號之后添加上面代碼盒子div3及子元素的樣式要求盒子div3的樣式要求為：寬度自動，高度自動，填充0，邊距0；超鏈接的樣式定義為兩種情況：沒有閱讀過的郵件超鏈接，使用類名a1定義為黑色，沒有下畫線，文本加粗顯示；閱讀過的郵件超鏈接，使用標簽名a定義為黑色，沒有下畫線，文本非加粗顯示。div3內部表格的樣式要求使用包含選擇符.div3table定義樣式：寬度100%。表格單元格使用包含選擇符.div3tabletd定義樣式：高度30px，下邊框1像素、實線、顏色#aaf，單元格內容在垂直方向居中，文本字號10pt。這里的下邊框用于設置每封郵件下面的橫線。表格需要包含5個列，列寬分別是30px、150px、自動auto、20px和120px，分別使用class類選擇符.td1,.td2,.td3,.td4和.td5定義修改receiveemail.php文件在盒子div2后面增加下面代碼，添加盒子div3及內部需要的表格<table>思考問題在變量$result中已經包含了當前頁要顯示的全部記錄，使用怎樣的程序結構、采取何種方法從該變量中逐條取出記錄并輸出？因為最后一頁剩下的記錄數(shù)并不確定，所以$result變量中的記錄數(shù)也是不確定的，因此此處可采用的最佳方案是使用while循環(huán)結構，循環(huán)條件是$row=mysqli_fetch_array($result)，若是能夠從$result中取出記錄，則條件成立，接下來可輸出記錄的信息，若是沒有取出記錄，則條件不成立，說明$result記錄指針已經指向最后一條記錄之后，循環(huán)結束即可處理$row中的數(shù)據(jù)處理$row記錄中的數(shù)據(jù)，為輸出做準備獲取當前郵件的emailno列值，保存在變量$emailno中備用；截取當前郵件sender列值中@符號前面的用戶名部分，保存在變量$sender中備用（使用list($sender)=explode('@',$row['sender'])實現(xiàn)）；處理當前郵件datesorr列值中的日期時間信息，得到“Y年m月d日”的形式保存在變量$riqi中備用；使用空格做分割符，分割$row['datesorr']內容，保留前面日期部分保存在$datesorr中，使用-做分割符，分割$datesorr的內容，年月日分別保存在$y,$m,$d中，連接$y,$m,$d的內容，得到“Y年m月d日”形式處理$row中的數(shù)據(jù)確定收件人賬號$uname是否閱讀過當前郵件將當前郵件readflag列值使用分號分割之后，將其保存在數(shù)組$readArr中；使用代碼in_array($uname,$readArr)獲取賬號$uname在數(shù)組$readArr中的索引，并將其保存在變量$isin中，該變量的取值可能是數(shù)組索引或者false。為false，則表示當前用戶沒有閱讀過該郵件修改receiveemail.php文件修改receiveemail.php文件，在div3的表格內部設計循環(huán)，獲取記錄，處理記錄中的數(shù)據(jù)為輸出做準備輸出郵件信息輸出表格的行起始標記輸出表格第一列的標記（引用選擇符td1）及內容，內容是復選框，name定義為markup[]，value屬性取值為變量$emailno的值，類名為checkbox；輸出表格第二列的標記（引用選擇符td2）及內容，內容是超鏈接，鏈接熱點為變量$sender的值，鏈接打開的文件是openemail.php，點擊后使用鍵名emailno向服務器端提交變量$emailno的值；若變量$isin為false，則表示當前用戶沒有閱讀過該郵件，超鏈接要引用類名a1。輸出表格第三列的標記（引用選擇符td3）及內容，內容是超鏈接，鏈接熱點為當前郵件subject列值，鏈接打開的文件是openemail.php，點擊后使用鍵名emailno向服務器端提交變量$emailno的值；若變量$isin為false，則表示當前用戶沒有閱讀過該郵件，超鏈接要引用類名a1。輸出郵件信息輸出表格第四列的標記（引用選擇符td4）及內容，判斷當前郵件附件列attachment的值是否為空，為空，則在單元格中輸出空格字符

（該字符不可或缺，若是該字符不存在，很多瀏覽器中將無法顯示該單元格的下邊框線）；若附件列的列值不為空，則輸出圖片flag-1.jpg；輸出表格第五列的標記（引用選擇符td5）及內容，內容是變量$riqi的值；輸出表格的行結束標記。修改receiveemail.php文件在準備好要輸出的數(shù)據(jù)之后，增加如下代碼分頁瀏覽頁面存在的問題問題分析：在運行receiveemail.php的頁面中，若是選擇了一封或者幾封郵件，點擊“刪除”按鈕時，需要運行delete.php文件將選中的文件放入已刪除文件夾中，但是若用戶沒有選擇要刪除的郵件而直接點擊了“刪除”按鈕，需要怎樣阻止運行delete.php文件？需要對receiveemail.php文件中的表單進行數(shù)據(jù)驗證，判斷如果沒有選擇要刪除的郵件，則阻止運行delete.php文件需要完成的設置在receiveemail.php的<form>標記中設置action為delete.php創(chuàng)建腳本文件receiveemail.js，在receiveemail.php文件中引用該腳本文件定義函數(shù)validate()函數(shù)validate()的功能說明使用document.getElementsByName('markup[]')獲取當前頁面中的所有復選框，構成一個組，使用數(shù)組markup表示；定義一個變量result，初始值為false，若是判斷后發(fā)現(xiàn)頁面中有被選擇的復選框，則該變量值要修改為true，否則保持為false。使用for結構逐個判斷復選框組中每個元素是否被選中，只要