综合小练习测试

Original 2019-01-01 20:11:38 218
abstract: 我的设计
我在这里等待你的到来!

选择框的运用发布时间:2018-12-28

选择框的运用发布时间:2018-12-29

选择框的运用发布时间:2018-12-29

选择框的运用发布时间:2018-12-29

选择框的运用发布时间:2018-12-29

选择框的运用发布时间:2018-12-29

选择框的运用发布时间:2018-12-29

选择框的运用发布时间:2018-12-29

选择框的运用发布时间:2018-12-29

选择框的运用发布时间:2018-12-29

选择框的运用发布时间:2018-12-29

选择框的运用发布时间:2018-12-29

选择框的运用发布时间:2018-12-29

新鲜事还可以输入150个字节

标题:

表情

图片

视频

话题

长微博

用户协议 隐私策略 投诉中心 京公网安备11000002000001号 互联网新闻信息服务许可 ©2018GongZi 使用前必读

css部分

*{ margin: 0px; padding: 0px; } body{ background-color: #333; font-size: 12px; } ul{ list-style: none; } header{ width: 100%; background-color: #000; overflow: hidden; } header div{ width: 960px; margin: 5px auto; } header div .td{ width: 960px; height: 24px; background-color: #222; } header div nav{ width: 960px; height: 40px; background-color: #fff; } header div.td span { width: 300px; height: 24px; line-height: 24px; text-align: center; font-size: 18px; color: red; font-family: "微软雅黑"; padding-left: 15px; } .fo{ float: right; width: 180px; margin: 0; } header div .zhuCe{ margin: 0px; width: 70px; height: 20px; float: right; line-height: 20px; } header nav ul li{ width: 118px; height: 40px; line-height: 40px; text-align: center; font-family: "微软雅黑"; float: left; border: 1px solid #424242; } header nav ul a li{ font-size: 18px; color: #cfcf66; background-color: #333; text-decoration: none; } header nav ul a li:hover{ color: red; background-color: #424242; } /*主题部分*/ #count{ width: 960px; min-height: 600px; _height:600px; background-color: #aaa; margin: 10px auto; overflow: hidden; } #count .pic{ width: 100%; height: 320px; overflow: hidden; margin: 6px auto; background-color: #cfc; } #count .pic img{ width: 960px; height: 320px; } /*主题左部分*/ #count .left{ width: 360px; min-height: 600px; _height:600px; float: left; background-color: #ffa; } /*主题右部分*/ #count .right{ width: 600px; min-height: 600px; _height:600px; float: right; } /*选择部分*/ .check div{ border: 1px solid red; border-radius: 5px; padding: 10px; } .check div p{ margin-bottom: 5px; border-bottom: 1px solid #552; } .check div p i{ float: right; } /*发布部分*/ .release{ border: 5px solid pink; border-radius: 10px; padding: 10px; margin-top: 6px; } .release div{ height: 24px; width: 100%; } .release div span{ display: block; height: 24px; line-height: 24px; float: right; margin-right: 10px; font-size: 14px; } .release div span i{ font-size: 16px; font-weight: bold; } .btxt{ width: 190px; background: pink; } .btxt input{ width: 150px; } #tt{ width: 100%; height: 160px; border:1px solid #ccc; } .release .but-div{ margin-bottom: 5px; height: 30px; } .but-div p{ width: 55px; height: 30px; line-height: 30px; float: left; padding-right: 10px; text-align: right; } .release .but-div .p1{ background: url(../images/an5.png) no-repeat left center; } .release .but-div .p2{ background: url(../images/an4.png) no-repeat left center; } .release .but-div .p3{ background: url(../images/an3.png) no-repeat left center; } .release .but-div .p4{ background: url(../images/an2.png) no-repeat left center; } .release .but-div .p5{ width: 80px; background: url(../images/an1.png) no-repeat left center; } .p6{ float: right; margin-left: 50px; } #btn{ width: 100px; height: 30px; border:none; background: pink; border-radius: 5px; line-height: 30px; text-align: center; } /*底部*/ footer{ clear: both; width: 100%; min-height: 300px; _height:300px; background-color: #222; } footer div{ width: 960px; height: 380px; margin: 0 auto; background-color: #222; } footer div .lg{ height: 340px; margin-bottom: 6px; border-bottom: 1px solid #444; } footer div p{ height: 30px; line-height: 30px; text-align: center; color: #ccc; background-color: #333; }

js部分

//头部 //时间 function shijian(){ var dt= new Date; y=dt.getFullYear(); m=dt.getMonth()+1; r=dt.getDate(); h=dt.getHours()+1; mi=dt.getMinutes(); s=dt.getSeconds(); mi=checkTime(mi); s=checkTime(s); str=(y+"年"+m+"月"+r+"日"+" "+h+":"+mi+":"+s); document.getElementById('txt').innerHTML=str; t=setTimeout('shijian()',500) } //一个数的时候前加0 function checkTime(i) { if (i<10) {i="0" + i} return i } $(document).ready(function(){ // 登陆按钮 $("#bt1").click(function(){ open("file:///D:/daima/menu/MyDemo/myForm.html"," zhuce","width=400,height=600,top=300,left=600"); }); // 注册按钮 $("#bt2").click(function(){ open("file:///D:/daima/menu/MyDemo/myForm.html","denglu ","width=400,height=600,top=300,left=600"); }); }); //pic轮播 window.onload=function(){ window.setInterval("fu()",1000); shijian(); } var j = 1; function fu(){ j++; if(j===7){ j=1; } var obj = document.getElementById("m1"); obj.src="images/img"+ j +".jpg"; } //主题选择部分 function checkAll(){ var check,allBox,xq; allBox=document.getElementById('allBox'); check=document.getElementsByName('check'); xq=document.getElementById('xq'); for (var i = 0; i < check.length; i++) { if (allBox.checked) { check[i].checked=true; xq.innerHTML="全不选"; }else{ check[i].checked=false; xq.innerHTML="全选"; } } } //内容发布 window.onload=function(){ var q1,tt,n,btn,biaoTi; q1=document.getElementById('sq'); tt=document.getElementById('tt'); btn=document.getElementById('btn'); biaoTi=document.getElementById('biaoTi') tt.onkeyup=function zijie(){ n=150-(tt.value.length); if (n<0) { q1.style.color="red"; }else{ q1.style.color="green"; } q1.innerHTML=n; } btn.onclick=function bb(){ if (n == 150) { alert("你还没有输入要提交的内容!"); }else if(n<0){ alert("输入超过当前字节!"); }else{ if (biaoTi.value=="") { alert("请输入标题!"); }else{ biaoTi.value=""; tt.value=""; alert("发布成功!"); } } } zijie(); bb(); }

老师,怎么把要发布的内容在点击提交后,然后在上面的选择部分自动动态添加进去?

Correcting teacher:天蓬老师Correction time:2019-01-01 20:20:18
Teacher's summary:alert("你还没有输入要提交的内容!"); 其实你完全可以在页面中放置一个占位符标签, 将提示信息放进去, 这样会更好

Release Notes

Popular Entries