Js实现懒加载和跨域
时间2024-05-20 04:04:03发布访客分类HTML浏览112
导读:懒加载 跨域 跨域 getAJAX(function(data { console.log(data ; },"http://10.9.156.51:8086/API/article/add.aspx" ;...
懒加载
跨域
跨域
getAJAX(function(data){
console.log(data);
}
,"http://10.9.156.51:8086/API/article/add.aspx");
查询数据
#container{
width: 992px;
margin: 20px auto;
}
th,td{
background:#fff;
font-size:14px;
height: 30px;
text-align: center;
"微软雅黑";
}
a{
color:#00468C;
text-decoration: none;
}
a:hover{
color:#00468C;
text-decoration: underline;
}
.even{
background:#ff6600;
}
#cover{
position: absolute;
left: 0;
top: 0;
width:100%;
height: 100%;
background: #000;
opacity:0.6;
filter:alpha(opacity=60);
display: none;
}
#updateform{
width:300px;
height: 300px;
border:solid 1px #CCC;
position: absolute;
left:50%;
margin-left: -150px;
top:50%;
margin-top: -200px;
display: none;
background: #fff;
}
#updateform h3{
display: block;
border-bottom:solid 1px #CCC;
border-bottom:solid 1px #CCC;
height: 38px;
line-height: 38px;
background: #ff6600;
margin: 0;
"">
微软雅黑;
color:#fff;
font-size: 16px;
}
#updateform form div{
padding-top: 10px;
}
function createData(b){
var str = "";
for(var i = 2;
i
var css = "";
if(i % 2 == 0){
css = "even"
}
str += ""
+ ""+b[i].ID+" | "
+ ""+b[i].ATitle+" | "
+ ""+b[i].AClickCount+" | "
+ ""+b[i].ATime+" | "
+ ""
+ "修改 | 删除"
+ " | "
+ "
";
}
var html = ""
+ ""
+ "编号 | "
+ "标题 | "
+ "点击量 | "
+ "发布时间 | "
+ "操作 | "
+ "
"
+ str
+ "
";
container.innerHTML = html;
}
window.onload = function(){
var url = "../../API/article/get.aspx";
getAJAX(function(data){
createData(data);
}
,url);
}
function delDOM(obj){
var tb1 = document.getElementById("tb1");
var id = obj.parentNode.parentNode.children[0].innerHTML;
getAJAX(function(data){
if(data.result == "ok"){
tb1.children[0].removeChild(obj.parentNode.parentNode);
}
}
,"../../API/article/del.aspx?id="+id+"");
}
function updateData(obj){
var cover = document.getElementById("cover");
var updateform = document.getElementById("updateform");
console.log(cover);
cover.style.display = "block";
updateform.style.display = "block";
var atitle = obj.parentNode.parentNode.children[1].innerHTML;
var clickcount = obj.parentNode.parentNode.children[2].innerHTML;
var id = obj.parentNode.parentNode.children[0].innerHTML;
var form = document.forms[0];
form.elements[0].value = atitle;
form.elements[1].value = clickcount;
form.elements[2].onclick = function(){
var xhr = createXHR();
xhr.open("POST","../../API/article/update.aspx",true);
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){
if(xhr.status == 200){
var data = eval("("+xhr.responseText+")");
if(data.result == "ok"){
updateform.style.display = "none";
cover.style.display = "none";
obj.parentNode.parentNode.children[1].innerHTML = form.elements[0].value;
obj.parentNode.parentNode.children[2].innerHTML = form.elements[1].value;
// var url = "../../API/article/get.aspx";
// getAJAX(function(data){
// createData(data);
// }
,url);
}
}
}
}
xhr.send("atitle="+form.elements[0].value+"&
aclickcount="+form.elements[1].value+"&
id="+id+"");
}
}
声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!
若转载请注明出处: Js实现懒加载和跨域
本文地址: https://pptw.com/jishu/663895.html