PHP 會員留言板系統

延續前篇:PHP 會員登入系統 結構 MySQL留言資料庫(message) 留言板頁面(msg.php) 留言新增功能(msg-add.php) 留言刪除功能(msg-del.php) MySQL留言資料庫(message) 編碼:utf8_unicode_ci 名稱 型態 備註 id int AI guest_id int content text date date 留言板頁面(msg.php) 結合 message 的 guest_id 與 member 的 id 在 message 的提取迴圈裡面,寫下指令 mysql_query( 讀取 member 資料表,WHERE條件設定 id=’$row[guest_id]’ ) <?php mysql_connect(“localhost”, “root”, “”); mysql_select_db(“hahow”); mysql_query(“SET NAMES UTF8”); //如果沒有登入的SESSION,就轉址 if (isset($_SESSION[“email”])==FALSE) { header(‘Location: login.php’); } ?> […]

clock

REF: JavaScript30 先備知識 JavaScript Date() 解說 模板字符串 原理 transform: rotate:指針旋轉 transition-timing-function:指針走動效果 Date():指針依照現在時間旋轉到適當位置 範例 .clock .clock-face .hand.hour-hand .hand.min-hand .hand.second-hand html background: #FFFFF0 font-family: ‘helvetica neue’ text-align: center font-size: 10px body font-size: 2rem display: flex flex: 1 min-height: 100vh align-items: center .clock width: 30rem height: 30rem border: 8px solid #086788 border-radius: 50% margin: 50px auto position: relative […]

JavaScript Date()

呼叫時間的方法 建立 Date 建構子物件 呼叫項目 範例 .text function runTime(){ //呼叫Date建構子物件 //()甚麼都不加,表示抓取現在時間 var now=new Date(); //呼叫現在的秒&分&時 var seconds=now.getSeconds(); var mins=now.getMinutes(); var hours=now.getHours(); //呼叫現在的年份 var years=now.getFullYears(); document.querySelector(“.text”).textContent=`現在是${hours}時${mins}分${seconds}秒`; } //毎一秒偵測一次時間 setInterval(runTime, 1000); Display

Piano Kit

REF: JavaScript30 音樂素材:魔王魂 説明 按下特定鍵盤按鈕,會出現鋼琴音與特效 先備知識 Key Code ATTR選擇器 模板字符串 箭頭函數 範例 .container .infos h1 Piano Keyboard .keys button.key(data-key=”65″) kbd A span C button.key(data-key=”83″) kbd S span D button.key(data-key=”68″) kbd D span E button.key(data-key=”70″) kbd F span F button.key(data-key=”71″) kbd G span G button.key(data-key=”72″) kbd H span A button.key(data-key=”74″) kbd J span B button.key(data-key=”75″) kbd […]

箭頭函數

目的 簡化function的形式,只保留參數與函式 //ES5 function(參數){ 函式 } //ES6 (參數) => {函式} 範例 var names=[“Ian”, “Moko”, “Afro”]; //ES5 //names的毎筆資料會丟進function的參數 //變成全名 //陣列.map(),修改原陣列,變成新的陣列 var fullNames=names.map( function(name){ return `${name} CHEN`; } ); console.log(fullNames);//[“Ian CHEN”, “Moko CHEN”, “Afro CHEN”] //ES6 //(參數) => {函式} var fullNames2=names.map( (name) => {return `${name} CHEN`;}); console.log(fullNames2);//[“Ian CHEN”, “Moko CHEN”, “Afro CHEN”] //只有一個參數的話可以不用() //也可以省略return,順便拿掉{} var fullNames3=names.map(name => […]

模板字符串

説明 ES6新規範,允許在字串内置入變數﹐參數等 變數﹐參數的地方用${}包起來 整個字串要用反引號`包起來(不使用雙引號”包) 範例 .text var a=3; var b=2; //整個字串要用反引號`包起來(不使用雙引號”包) //變數﹐參數的地方用${}包起來 document.querySelector(“.text”).textContent=`計算變數a+b=${a+b}`; Display

keyCode

JavaScript keyCode JS用來識別特定鍵的鍵盤碼 鍵盤碼査詢 方法一:網頁査詢 Keycode 方法二:console.log window.addEventListener(“keydown”, function(e){ console.log(e.keyCode); } ); //然後打開console,對著網頁區域任意按鍵盤,就會出現鍵盤碼 相同方法:event.which window.addEventListener(“keydown”, function(e){ console.log(e.which); } ); //一樣打開console,對著網頁區域任意按鍵盤,就會出現鍵盤碼

Bootstrap格線系統

中文說明手冊 結構 Bootstrap的格線系統,把寬度切成12分,用橫向的row裝縱向的col,指定每個col佔12分長的多少分。 尺寸關鍵字 xs:超小螢幕 < 768px sm:小螢幕 > 768px md:中螢幕 > 992px lg:大螢幕 > 1200px link(rel=”stylesheet”, href=”https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css”) .row .col-lg-6.col-md-7.col-sm-4 .col-lg-6.col-md-5.col-sm-8 //用row包覆column //col可以向上繼承,無法向下繼承 //只指定lg → 不會套用到xs //只指定xs → 可以套用到lg 顯示與隱藏 指定col在特定元素下顯示或隱藏 visible-尺寸:只在該尺寸顯示 hidden-尺寸:只在該尺寸隱藏 link(rel=”stylesheet”, href=”https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css”) .row .col-xs-12.visible-xs h3 XS(超小螢幕<768px) .col-xs-12.visible-sm h3 SM(小螢幕>768px) .col-xs-12.visible-md h3 MD(中螢幕>992px) .col-xs-12.visible-lg h3 LG(大螢幕>1200px) 偏移 col-尺寸-offset-欄位數:指定左側向右偏移的大小 link(rel=”stylesheet”, href=”https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css”) .row .col-sm-8.col-sm-offset-4 h3 […]

Access 阻止截斷方法

目的 利用Access的外部匯入功能開啓csv檔案, 若某儲存格内容文字超過225字,Access就會不載入225字以後的部分, 導致内容缺失。 解決方法 資料類型:改成【長文字】 Access→外部資料→匯入文字檔 選擇csv檔案 左下角的進階,指定資料比較長的欄位,手動改成【長文字】