发表于: 2018-12-04 20:54:42

2 783


今天完成的事情:(一定要写非常细致的内容,比如说学会了盒子模型,了解了Margin) 

今天完成了js2的任务的分发,完成效果图如下:

做了如下的事情:

一:监听input输入的参数

//获取input人数
if ("oninput" in inputNumber) {
inputNumber.addEventListener("input", getWord, false);
} else {
inputNumber.oninput = getNumber;
}
//分配人数
function getWord(){
if(inputNumber.value>3&&inputNumber.value<19){
werwolf.innerHTML=parseInt((inputNumber.value)/3);
civilian.innerHTML=inputNumber.value-werwolf.innerHTML;
getNumber();
}else{
werwolf.innerHTML=null;
civilian.innerHTML=null;
}
};

oninput

oninput 事件在用户输入时触发。

该事件在 <input> 或 <textarea> 元素的值发生改变时触发。

提示: 该事件类似于 onchange 事件。不同之处在于 oninput 事件在元素值发生变化是立即触发, onchange 在元素失去焦点时触发。另外一点不同是 onchange 事件也可以作用于 <keygen> 和 <select> 元素。

oninput就是输入总人数的时候同时分配的狼人和平民的人数

2.找到一个新的input的类型range

Input Range 对象属性

disabled 设置或返回滑块控件是否被禁用。

max 设置或返回滑块控件的 max 属性值。

min 设置或返回滑块控件的 min 属性值。

name 设置或返回滑块控件的 name 属性值。

step 设置或返回滑块控件的 step 属性值。

type 返回滑块控件的表单元素类型。

3.addEventListener

element.addEventListener(event, function, useCapture)

addEventListener() 方法用于向指定元素添加事件句柄。

event 必须。字符串,指定事件名。

function 必须。指定要事件触发时执行的函数。 

useCapture 可选。布尔值,指定事件是否在捕获或冒泡阶段执行。


明天计划的事情:(一定要写非常细致的内容) 

继续完成js2
遇到的问题:(遇到什么困难,怎么解决的) 

暂无
收获:(通过今天的学习,学到了什么知识)

了解了事件监听,了解了函数之间的调用



返回列表 返回列表
评论

    分享到