发表于: 2017-02-10 23:13:40
3 1376
今天完成的事情:
1. 完成任务4的杀人功能,改变选中杀死玩家的样式,并存储其所在位置到数组DeadArr,在新的杀人/投票页面中显示已死玩家样式和选中玩家样式不同;
2. 第2天回到杀人页面时,实现通过调用sessionStorage存储的死亡玩家数组DeadArr,去完成死亡玩家样式和点击功能的设置;
3. 学习了两个知识点index()的用法,jQuery中this和$(this)的区别;
4. 学习文杰的小课堂,了解了class和id的不同以及其运用;
明天计划的事情:
继续做任务4,逐步理清逻辑往下完成游戏,还有判断游戏结果,游戏结束,以及游戏时间计算两个功能未实现,约需1一天半时间,再用半天回顾任务2-4,学习学习其他人代码;
遇到的问题:
1. 杀人页面:第2天调用sessionStorage存储的DeadArr死亡玩家数组,如果直接写进window,因为第一次进入页面时DeadArr还未存储,无定义,js编译不下去。
解决方法:用if判断当typeof (sessionStorage.deadsArr) != "undefined"时,调用获取sessionStorage中的数组,实现功能,在第一次进入页面时就不会运行其中的内容;
2. 用clone复制出的角色的卡牌div,用jQuery通过class名获取元素,直接指向所有的class相同的对象,如何指向其中一个?
用each函数遍历class为statusblock的块(角色的卡牌),$(this)则会指向当前对象,对$(this)进行操作即可;
3. 如下包含$(this)的函数,在本js程序中的$(".statusblock").each(…)函数中多次调用,
if (role == "杀手") {
alert("不能杀同伴,请选择其他玩家")
}
else{
$(".statusblock").addClass("border-white").removeClass("border-gray");
$(this).addClass("border-gray").removeClass("border-white");
console.log("选中了" + boxNumber);
}
如何对其重新定义,精简代码,同时不改变$(this)的指向?
收获:
1. jQuery中index()的使用:函数用于获取当前jQuery对象中指定DOM元素的索引值。index()方法的返回值为Number类型,返回指定元素的索引位置(从0开始算起)。
如在我的任务4-3页面中,$(".main .statusblock").index(this)可得到当前指向的class为.statusblock的div的索引值,对其+1则为选中的n号玩家;
2. $.inArray(object,Array)可判断Array中是否包含object对象,若不包含返回-1,包含则返回object在数组中的位置;
3. this与$(this):$(this)可以返回一个jquery对象。那么,当你在网页中alert($('#id'));时,会弹出一个[object Object ],这个object对象,也就是jquery对象了。this指向的是一个对象,可以指向全局的对象(如window)或一个html对象,看下面我的任务4中的两个例子:
$(".statusblock").each(function() {$(this).click(…)};
其中的$(this)指向对象,当前选择的class为statusblock的对象,可用jQuery函数对其进行操作,如果改成this则指向的是html中的class为statusblock的一个div;
var boxNumber = $(".main .statusblock").index(this);
这里的this指向函数的第一个参数,这里应该是对象” .main .statusblock”(这里理解可能有误,请指正),欢迎大家一起讨论学习;
评论