发表于: 2017-07-09 23:48:34

2 883


今天完成的事情:

1、把js2任务2的页面改好。

2、写完js3的任务页面。

明天计划的事情:

1、着手写js3的js代码,继续学习jquery的有关内容。

遇到的问题:

JS任务2关于输入玩家数值按enter键会刷新页面,百度了下找到了解决方案。

问题:鼠标聚焦到TextBox输入框时,按回车键刷新页面


 方式1:input中当回车的时候,不理会

<input type="text"  id="playerNum" />

$('#playerNum').keypress(function(event){

         if(event.keyCode == 13){

                return false;

}

});

用户点击了回车就阻止默认的行为。
 方式2:将form中的submit事件设置返回false,则不会进行提交
<form onsubmit="return false;">.......</form>
方式3:在form中增加一个隐藏的input
<input type="text" style="display:none" />
因为考虑到结构、样式、行为的分离,没有选择第二种方法,
如果添加一个隐藏的input的标签则会导致代码的亢余。
收获:

1、关于localStroage和sessionStorage

html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage。
sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储,仅仅是会话级别的存储。
localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的.
都是用来存储本地数据,他们存值都是以键值对形式存在,值也是存入字符串类型(如果是对象,就序列化以后再存入)。
Web Storage的概念和cookie相似,用来存储键值对,区别是它是为了更大容量存储设计的。Cookie的大小是受限的,并且每次你请求一个新的页面的时候Cookie都会被发送过去,这样无形中浪费了带宽,另外cookie还需要指定作用域,不可以跨域调用。
除此之外,Web Storage拥有setItem,getItem,removeItem,clear等方法,不像cookie需要前端开发者自己封装setCookie,getCookie。
但是Cookie也是不可以或缺的:Cookie的作用是与服务器进行交互,作为HTTP规范的一部分而存在 ,而Web Storage仅仅是为了在本地“存储”数据而生(来自@otakustay 的纠正)。
SessionStorage、localStorage 都有setItem,getItem,removeItem、clear();等方法
1、Session.setItem('key','value'),将value的值存储到key字段,ps:key、value都是字符串形式。
2、var key=Session.getItem('key');  通过设置变量key提取存储在key字段中的值。
3、Session.removeItem('key'); 删除指定key字段中保存的值
4、Session.clear();删除所有本地key/value。
如果设置了相同的key,那么后面的key里面的值会覆盖前面的key里面的值。
例如:Session.setItem('key','a');
Session.setItem('key','b');

这里的key所指向的值就是'b'.


localStorage.setItem('key','value');
var b=localStorage.getItem('key');
localStorage.clear();
alert(b);
问题有点弱智了,在这里我清除了所有本地存储的key,然后alert(b)还是出现value。

后来才发现是先把这个值存储在变量b上,在进行清除操作,虽然本地存储的键值对已经清除,而变量b中的值并没有清除,

如果把localStorage.clear()放在设置变量b之前,这个就没毛病了。

2、关于Jquery

         1、 jquery中$(":input")和$("input")有什么区别?
            :input 选中所有的 input select textarea button 元素
            input 只选中input元素。
        2、 toggle() 方法切换元素的可见状态。

      如果被选元素可见,则隐藏这些元素,如果被选元素隐藏,则显示这些元素。

     这个方法我觉得可以用在js3任务的关于查看身份两张图片的切换可以用到。




返回列表 返回列表
评论

    分享到