手机备忘录html,备忘录.html · l1903271712@qq.com/ written - Gitee.com

备忘录

.container{

width: 100%;

height: 800px;

background:url(../images/bwl.jpg) ;

}

.head h3{

color: #ffff33;

}

.head span{

display: block;;

font-size: 24px;

color: #00ffcc;

line-height: 30px;

}

.content{

width: 80%; height: 80%;

margin: 3% 10% 0 10%;

}

.content textarea{

width: 100%; height: 90%;

background: #333;

font-size: 18px;

font-family:Arial,Verdana,Sans-serif;

color: #00cc00;

}

.icon li{

display: block;

height: 5%;

}

.bg li{

display: block;

width:3%;

}

.bg li a{

display: block;

width: 20px;

height: 20px;

border:1px solid #333;

}

.left{

padding-left: 10%;

}

.image{

width:100%;height: 5%;

background: #ccc;

}

.image span{

display: inline-block;

width: 4%;height: 100%;

padding-right: 1%;

}

.image span img{

display: inline;

margin-top:-40px;

}

完成 

最近编辑时间:

• 房子
• 花朵
• 夜晚
• 夏天
• 星星

var date=new Date();

var value=date.getFullYear()+"年"+(date.getMonth()+1)+"月"+date.getDate()+"日"+date.getHours()+":"+(date.getMinutes()<10 ? "0"+date.getMinutes():date.getMinutes())+":"+(date.getSeconds()<10? "0"+date.getSeconds():date.getSeconds());

$('.time').text("现在是北京时间："+value);

$('.bg a').click(function(){

var tmp=$(this).css("background-color");

$('.content textarea').css("color",tmp);

});

$('.save').click(function(){

bootbox.confirm("已经保存好了呦！😊",function(result){

if(result){

if(window.localStorage){

$('.prevtime').text("最近编辑时间:"+storage.getItem('PrevTime'));

}

storage.setItem("TxtContent",$('textarea').val());

storage.setItem("PrevTime",value);

window.location.reload();

}

});

});

var img=new Image();

$('.addimg').click(function(){

bootbox.confirm({

title: '请输入位置和图片源地址',

message:`

`,

callback:function(result){

if(result){

img.src=$('.imgsrc').val();

var index=$('.imgindex').val();

$('.image span:eq('+index+')').append(img);

}

}

});

});

$('.delete').click(function(){

bootbox.confirm("确定删除全部吗？",function(result){

if(result){

$('textarea').val("");

}

});

});

$('.edit').click(function(){

bootbox.confirm({

title: '输入更改的信息',

message:``,

callback:function(result){

if(result){

var tmp=$('textarea').val();

tmp+=$('.addtxt').val();

$('textarea').val(tmp);

}

}

});

});

$('.bgp a').click(function(e){

var pn=$(this).attr("name");

if(pn==="../images/house.jpg")

$('.content textarea').css("background-image","url(../images/house.jpg)");

else if(pn==="../images/flower.jpg")

$('.content textarea').css("background-image","url(../images/flower.jpg)");

else if(pn==="../images/summer.jpg")

$('.content textarea').css("background-image","url(../images/summer.jpg)");

else if(pn==="../images/star.jpg")

$('.content textarea').css("background-image","url(../images/star.jpg)");

else

$('.content textarea').css("background-image","url(../images/dark.jpg)");

});

/*设置与获取Cookie*/

var Cookie ={}

Cookie.write = function(key, value, duration){

date.setTime(date.getTime()+1000*60*60*24*30);

document.cookie = key + "=" + encodeURI(value) + "; expires=" + date.toGMTString();

};

Cookie.read = function(key){

var arr=document.cookie.match(new RegExp("(^| )"+key+"=([^;]*)(;|$)"));

if(arr != null)

return decodeURIComponent(arr[2]);

return "";

};

//定义本地存储对象

var storage = {

getItem:function(key){//假如浏览器支持本地存储则从localStorage里getItem，否则乖乖用Cookie

return window.localStorage? localStorage.getItem(key): Cookie.read(key);

},

setItem:function(key,val){//假如浏览器支持本地存储则调用localStorage，否则乖乖用Cookie

if (window.localStorage) {

localStorage.setItem(key,val);

} else {

Cookie.write(key,val);

}

}

};

window.οnbefοreunlοad=function(){

// 离开本页之前保存数据

if(!window.localStorage){

storage.setItem('TxtContent',$('textarea').val());

storage.setItem('PrevTime',value);

}else{

storage.setItem('TxtContent',$('textarea').val());

storage.setItem('PrevTime',value);

}

};

window.οnlοad=function(){

// 加载页面时判断是否有数据并加载

if(!window.localStorage){

if(storage.getItem('TxtContent')==undefined) {

$('textarea').val("");

}else{

$('textarea').val(storage.getItem('TxtContent'));

$('.prevtime').text("最近编辑时间:"+storage.getItem('PrevTime'));

}

}else{

if(storage.getItem('TxtContent')!=null){

$('textarea').val(storage.getItem('TxtContent'));

$('.prevtime').text("最近编辑时间:"+storage.getItem('PrevTime'));

}else{

$('textarea').val("");

}

}

};

一键复制

编辑

Web IDE

原始数据

按行查看

历史