今天完成的事情:
上午醒的比较早,因为身体不适的原因,今天停止了代码实战,看了一章半的书,看完了一半关于表单事件的介绍,因为之前一直困顿与keydown等以及失焦事件(blur),获得焦点事件(focus)。加强了对于这一方面的理解。
myform.age.addEventListener("blur",ageBlur); 例如这行,blur 代表着在age也就是我的表单name的名称发生失去焦点的时候执行ageBlur(这是我设置的函数)函数。AddEventListener 代表事件监听,这是我之前所不了解的。
function ageBlur(e){
var target = e.target; //e,Event对象的target属性,及内部文本框内容
if(isNaN(target.value)){ //判断age框中的值是否能转化为数值 //不能的情况下执行
alert("请输入的你的年龄");
}
}
获悉了e.target的用法。 以及isNaN检查e.target是否为数字值,非数字值则执行if下面的函数。
理解了一下数组乱序的函数的执行原理
例:
var res=new Array();
for( var i=0, len=arr.length; i<len; i++){
var j =Math.floor(Math.random()*arr.length);
res[i]=arr[j];
arr.splice(j,1);
}
定义一个函数arr res,执行for语句,(中间刚开始的时候我没有在for语句中定义len的长度,我直接采用for(var i = 0; i<arr.length; i++ ); 下面内容不变,当我执行这条语句的时候console里面会出现,生成4段res数组出来,然后我之后猜测,for是局部作用,所以如上进行设置,问题没有了。
除此之外今天完成了一下,关于平民与杀手分配的的事情。
然后我看了一下别人的代码,发现自己的代码完全和别人有大量的差别,就是逻辑上看起来。
我猜我也就是任务里面说的要求问题一样,后期的可扩展性可能太差。
晚上学习了一下jQuery ,,准备使用jQuery重新写一遍js代码。
明天的任务:
明天可能需要外出,如没意外的话会进行以下任务。
学习关于如何进行数据传递,jQueryDOM的操作,有时间进行js利用jquer重写
同时附上我的代码,望师兄指点一下,看看是不是很乱。
现在暂时因为我还不知道如何进行数据传递,为了直观的看到效果我采用了alert,会弹出关于分配的结果 //只有在失焦的时候回才会弹出。
附上代码::
function loseFous(){
var ss =document.getElementById("ss"); //获取杀手
var pm =document.getElementById("pm"); //获取平民
ss.innerHTML=0;
pm.innerHTML=0;
var txt = document.getElementById("txt").value;
if(parseInt(txt) < 4 || parseInt(txt) >18){
alert("输入无效");
}else{
var arr=new Array();
ss.innerHTML=Math.floor(txt/4);
for(var i=0; i<parseInt(ss.innerHTML);i++){ //利用遍历的方法对每个数组进行赋值, push 为添加数组
arr.push('杀手');
}
pm.innerHTML=txt-ss.innerHTML; // 得出杀手和平民的数量
for(var i=0; i<parseInt(pm.innerHTML); i++){ //
arr.push('平民')
}
//数组乱序
var res=new Array();
for( var i=0, len=arr.length; i<len; i++){
var j =Math.floor(Math.random()*arr.length);
res[i]=arr[j];
arr.splice(j,1);
}
alert(res) //res为乱序后的数组即杀手与平民的随机分配
}
}
function rel(){ //点击执行
//在rel 也就是onlick点击时,因为点击也是属于失去焦点,失去焦点和onlick都会进行执行,优先会执行失去焦点blur函数,本例子暂时没有出现问题。冲突问题便又有追究
var txt = document.getElementById("txt").value;
if(parseInt(txt) < 4 || parseInt(txt) >18){
alert("输入无效");
}
else{
window.location.href='test-4.html';
}
} //if语句判断输入
评论