使用jQuery快速高效製作網頁互動特效 第三章 上機練習三 製作課工場論壇發帖
阿新 • • 發佈:2018-12-17
<script type="text/javascript">
//我要發帖 var num = 0; function Posting() { if (num == 0) { document.getElementsByClassName("post")[0].style.display="block"; num = 1; } else if (num == 1) { document.getElementsByClassName("post")[0].style.display="none"; num = 0; } } //陣列:儲存頭像 var tou = new Array("tou01.jpg","tou02.jpg","tou03.jpg","tou04.jpg"); //獲取填寫資訊併發布 function Publish() { if (num == 1) { /*獲取填寫的各項值*/ var Title = document.getElementsByClassName("title")[0].value; //標題 var Block = document.getElementsByTagName("select")[0].value; //所屬版塊 var Content = document.getElementsByClassName("content")[0].value; //內容 //獲取釋出時間 var myDate = new Date(); var Time = myDate.getFullYear() + "-" + myDate.getMonth() + "-" + myDate.getDate() + " " + myDate.getHours() + ":" + myDate.getMinutes(); //獲取隨機數選擇頭像 var iNum = Math.floor(Math.random() * 3 + 0); /*插入發帖內容*/ var bName = document.getElementsByTagName("section")[0]; var ul = document.createElement("ul"); ul.innerHTML = "<li>" + "<div>" + "<img src=\"images/" + tou[iNum] + "\">" + "</div>" + "<h1>" + Title + "</h1>" + "<p>" + "<span>所屬版塊:" + Block + "</span>" + "<span>" + Time + "</span>" + "</p>" + "</li>"; bName.appendChild(ul); /*釋出成功收起彈出*/ document.getElementsByClassName("post")[0].style.display="none"; num = 0; /*清除填寫的各項值*/ document.getElementsByClassName("title")[0].value = ""; document.getElementsByTagName("select")[0].value = document.getElementsByTagName("option")[0].value; document.getElementsByClassName("content")[0].value = ""; } } </script>