跪求一个用js css写的一个回复评论模块 简单点就好

JavaScript037

跪求一个用js css写的一个回复评论模块 简单点就好,第1张

只能装一下的,一刷新就没了

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title></title>

<style>

.box{

width:500px

height:300px

border:1px solid #ccc

padding:10px

box-sizing:border-box

}

.write{

margin-top:50px

}

textarea{

width:500px

height:94px

box-sizing:border-box

}

</style>

<script type="text/javascript" src="js/jquery-2.1.0.js" ></script>

</head>

<body>

<div>

<h2>评论区</h2>

<div class="box">

<!--<p>我是评论内容1</p>-->

</div>

</div>

<div class="write">

<textarea id="textblock"></textarea>

<button class="submit">提交内容</button>

</div>

<script>

$(function(){

var arr = []

function writecon(){

var str = ''

for(var i=0 i<arr.length i++){

str += "<p>" + arr[i] + "</p>"

}

$(".box").append(str)

}

writecon()

$(".submit").click(function(){

var textblock = $("#textblock").val()

if(textblock){

arr.push(textblock)

var str = "<p>" + textblock + "</p>"

$(".box").append(str)

$("#textblock").val("")

console.log(arr)

}else{

alert("请输入内容")

}

})

})

</script>

</body>

</html>

建议使用jquery 很方便就能实现你要的效果,

在控件的onclick="loadDiv('login.aspx','','用户登录','modify')"

function loadDiv(url,option,title,divID)

{

var id=(new Date()).getTime()

if(divID)

{

colseDiv(divID)

id=divID

}

var div=$('<div id="msg'+id+'" class="message">')

if(url.indexOf('?')!=-1)

{

url+='&container='+id

}else

{

url+='?container='+id

}

var container=$('<div id="container'+id+'" class="container">')

var title=$('<div class="title">'+title+'<input type="image" name="imageField" id="imageField" src="/images/no.gif" alt="关闭" onclick="colseDiv(\''+id+'\')" style="position:absoluteright:0pxcursor:handborder:0px" onload="$(this).parent().find("#spanClose").css("display","none")"/><span id="spanClose" style="position:absoluteright:0pxcursor:handborder:0px" onclick="colseDiv(\''+id+'\')">关闭</span></div>')

container.append(title)

container.append(div)

div.html('<img src="/images/loading.gif"style="border:0px"><font color="red">正在加载,请稍候。。。</font>')

container.css("z-index",_conatinerID++)

$('body').append(container)

//var offset=$(event.srcElement).offset()

//var x = offset.left

//var y = offset.top

var x = 500

var y = 150

anchToTarget(id,x,y)

var data=null

if(option &&option.data)data=option.data

div.load(url,data,function()

{

anchToTarget(id,x,y)

if(option &&option.callback)

{

option.callback(id)

}

})

}

用到的核心样式.container{

position: absolute

z-index: 40

left:0px

top:0px

text-align:center

border-top:solid #4569A5 2px

border-left:solid #4569A5 2px

border-right:solid #6F91C8 2px

border-bottom:solid #6F91C8 2px

width:auto

}

用到的jquery.js代码太多,自己可以去百度上下载也可联系我给你