报名页面总结

2017-10-18  本文已影响0人  胖太_91bf

1.下拉列表出生日期

//js部分
        window.onload=function(){
            var selects = document.getElementsByTagName("select");//通过标签名获取select对象
            var date = new Date();
            var nowYear = date.getFullYear()-1;//获取当前的年
            var opt = document.getElementById('opt')
            for(var i=nowYear-100;i<=nowYear;i++){
                var optionYear = document.createElement("option");
                optionYear.innerHTML=i;
                optionYear.value=i;
                selects[0].insertBefore(optionYear, opt);
            }
            for(var i=1;i<=12;i++){
                var optionMonth = document.createElement("option");
                optionMonth.innerHTML=i;
                optionMonth.value=i;
                selects[1].appendChild(optionMonth);
            }
            getDays(selects[0].value,selects[0].value,selects);
        }
        // 获取某年某月存在多少天
        function getDaysInMonth(month,year){
            var days;
            if (month==1 || month==3 || month==5 || month==7 || month==8 || month==10 || month==12) {
                days=31;
            }else if (month==4 || month==6 || month==9 || month==11){
                days=30;
            }else{
                if ((year%4 == 0 && year%100 != 0) || (year%400 == 0)) {     // 判断是否为润二月
                    days=29;
                }else {
                    days=28;
                }
            }
            return days;
        }
        function setDays(){
            var selects = document.getElementsByTagName("select");
            var year = selects[0].options[selects[0].selectedIndex].value;
            var month = selects[1].options[selects[1].selectedIndex].value;
            getDays(month,year,selects);
        }
        function getDays(month,year,selects){
            var days = getDaysInMonth(month,year);
            selects[2].options.length = 0;
            for(var i=1;i<=days;i++){
                var optionDay = document.createElement("option");
                optionDay.innerHTML=i;
                optionDay.value=i;
                selects[2].appendChild(optionDay);
            }
        }

html 结构

               <div class="date1">
                    <select onchange="setDays()" id="year">
                        <option value="2017" id="opt">2017</option>
                    </select>
                    <span>年</span>
                    <select onchange="setDays()" id="month"></select>
                    <span>月</span>
                    <select id="day"></select>
                    <span>日</span>
                </div>

2.添加和移除disabled属性

//添加disabled
$('#sick').attr('disabled',true)
//移除disabled
$('#sick').removeAttr('disabled')
  1. 获取radio选中的值
$(".checkbox input[type='radio']:checked").val()

4.点击判断checkbox是否本选中状态

    $('#sicks').click(function() {
        console.log(this.checked)
        if(this.checked) {
            //选中后的操作
        } else {
            为取消选中后的操作
        }
    })
  1. 获取上传图片的base64代码
function readURL(input,img) {
    if (input.files && input.files[0]) {
        console.log(input.files);
        var reader = new FileReader();
        reader.onload = function (e) {
            img.attr('src', e.target.result);
            console.log(e.target.result)
        };
        reader.readAsDataURL(input.files[0]);
    }
}
  1. 如何判断数组全部循环一遍
  var arr = [ 1,2,3,4,5,6,7,8 ];
  var i = 0;
   arr.forEach(function(item){
      i ++;
   })
   if(i === arr.length) {
      console.log('arr已经被全部循环一遍')
   }
  1. input[type=file] 调用手机系统相册方法
<input type="file" accept="image/*"/>
//添加accept属性,有三个参数accept="audio/*和"accept="video/*"
上一篇下一篇

猜你喜欢

热点阅读