首页 新闻 会员 周边

为啥获取不到这个值?

0
悬赏园豆:50 [待解决问题]

1.我只想问的是为什么showBtn里面的aNowSpan[0].parentNode.onclick点击后不能再获取到leftmonth和leftyear的值,或者我把leftmonth和leftyear都写进了onclick里面还是不能获取新的值,这又是为什么?
2.如果不用递归怎么获取leftmonth和leftyear的值?

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
*{ margin:0; padding:0; font-size:12px;}
#div1{ margin:20px; position:absolute; top:25px; left:10px; display:none;}
#nowTime{ width:330px; float:left;}
#nextTime { width:330px; float:left; margin:0 0 0 10px;}
.title{ width:100%; height:30px; background:#17a4eb; color:#FFFFFF; position:relative;}
.title .c{ text-align:center; line-height:30px;}
.title .l{ position:absolute; top:6px; left:5px;}
.title .r{ position:absolute; top:6px; right:5px;}
table{ width:100%; background:#dee3e9; color:#9ea7ac;}
table tr{ background:#f9fafc;}
table th{ width:46px; padding:5px;}
table td{ padding:5px; text-align:center;}
.red{ color:#FF0000;}
.blue{ color:#0000FF;}
table td p{ color:#FF0000;}

input{ margin:20px;}
</style>
<script>
window.onload = function(){
    var aInput = document.getElementsByTagName('input');
    var oDiv = document.getElementById('div1');
    var oNowTime = document.getElementById('nowTime');
    var oNextTime = document.getElementById('nextTime');
    var aTd = oDiv.getElementsByTagName('td');
    var aNowSpan = oNowTime.getElementsByTagName('span');
    var aNextSpan = oNextTime.getElementsByTagName('span');
    
    var bBtn = true;
    
    aInput[2].onclick = function(){
        var oDate = new Date();
        if(bBtn){
            oDiv.style.display = 'block';
            
            if(oDate.getMonth()+1==12){
                showDate(oNowTime,oDate.getFullYear(),oDate.getMonth()+1,true);
                showDate(oNextTime,oDate.getFullYear()+1,1);
            }
            else{
            showDate(oNowTime,oDate.getFullYear(),oDate.getMonth()+1,true);
            showDate(oNextTime,oDate.getFullYear(),oDate.getMonth()+2);
            }
            
            showColor(oDate.getDate());
            showBtn();
            
        }
        else{
            oDiv.style.display = 'none';
        }
        
        bBtn = !bBtn;
        
    };
    
    function showDate(obj,year,month,bBtn){
    
        var oDate = new Date();
        var dayNum = 0;
    
        if(!obj.bBtn){
            obj.oTitle = document.createElement('div');
            obj.oTitle.className = 'title';
            obj.appendChild(obj.oTitle);
            
            var oTable = document.createElement('table');
            var oThead = document.createElement('tHead');
            var oTr = document.createElement('tr');
            var arr = ['周一','周二','周三','周四','周五','周六','周日'];
            for(var i=0;i<7;i++){
                var oTh = document.createElement('th');
                oTh.innerHTML = arr[i];
                if(i==5 || i==6){
                    oTh.className = 'red';
                }
                oTr.appendChild(oTh);
            }
            oThead.appendChild(oTr);
            oTable.appendChild(oThead);
            
            var oTbody = document.createElement('tBody');
            for(var i=0;i<6;i++){
                var oTr = document.createElement('tr');
                for(var j=0;j<7;j++){
                    var oTd = document.createElement('td');
                    oTr.appendChild(oTd);
                }
                oTbody.appendChild(oTr);
            }
            oTable.appendChild(oTbody);
            obj.appendChild(oTable);
            
            
            obj.bBtn = true;
        }

                
        obj.oTitle.innerHTML = ( bBtn ? '<div class="l"><span>'+(month-1)+'</span>月</div>' : '<div class="r"><span>'+(month+1)+'</span>月</div>')+'<div class="c"><span>'+year+'</span>年<span>'+month+'</span>月</div>';

        
        var aTd = obj.getElementsByTagName('td');
        for(var i=0;i<aTd.length;i++){
            aTd[i].innerHTML = '';
        }
        
        if(month==1 || month==3 || month==5 || month==7 || month==8 || month==10 || month==12){
            dayNum = 31;
        }
        else if(month==4 || month==6 || month==9 || month==11){
            dayNum = 30;
        }
        else if(month==2 && isLeapYear(year)){
            dayNum = 29;
        }
        else{
            dayNum = 28;
        }
        
        oDate.setFullYear(year);
        oDate.setMonth(month-1);
        oDate.setDate(1);
        
        switch(oDate.getDay()){
            case 0:
                for(var i=0;i<dayNum;i++){
                    aTd[i+6].innerHTML = i+1;
                }
            break;
            case 1:
                for(var i=0;i<dayNum;i++){
                    aTd[i].innerHTML = i+1;
                }
            break;
            case 2:
                for(var i=0;i<dayNum;i++){
                    aTd[i+1].innerHTML = i+1;
                }
            break;
            case 3:
                for(var i=0;i<dayNum;i++){
                    aTd[i+2].innerHTML = i+1;
                }
            break;
            case 4:
                for(var i=0;i<dayNum;i++){
                    aTd[i+3].innerHTML = i+1;
                }
            break;
            case 5:
                for(var i=0;i<dayNum;i++){
                    aTd[i+4].innerHTML = i+1;
                }
            break;
            case 6:
                for(var i=0;i<dayNum;i++){
                    aTd[i+5].innerHTML = i+1;
                }
            break;
            
        }
        
        if(month==1 && bBtn){
            obj.oTitle.getElementsByTagName('span')[0].innerHTML = 12;
        }
        else if(month==12 && !bBtn){
            obj.oTitle.getElementsByTagName('span')[0].innerHTML = 1;
        }
        
    }
    
    function isLeapYear(year){
        if(year%4==0 && year%100!=0){
            return true;
        }
        else{
            if(year%400==0){
                return true;
            }
            else{
                return false;
            }
        }
    }
    
    function showColor(date){
        var result = [];
        var oDate = new Date();
        var re = new RegExp(''+date+'(<p>)*');
        var bBtn = true;
        var index = 0;
        
        for(var i=0;i<aTd.length;i++){
            if(aTd[i].innerHTML!=''){
                result.push(aTd[i]);
            }
        }
        
        if(aNowSpan[1].innerHTML == oDate.getFullYear() && aNowSpan[2].innerHTML == oDate.getMonth()+1){
            
            for(var i=0;i<result.length;i++){
                if(re.test(result[i].innerHTML) && bBtn){
                    result[i].className = 'red';
                    index = i;
                    bBtn = false;
                }
            }
            
            for(len=index+11;index+1<len;index++){
                result[index+1].className = 'blue';
            }
            
        }
        else{
            for(var i=0;i<result.length;i++){
                result[i].className = '';
            }
        }
        
    }
    
    function showBtn(){
        var leftMonth = parseInt(aNowSpan[0].innerHTML);
        var leftYear = parseInt(aNowSpan[1].innerHTML);
        var rightMonth = parseInt(aNextSpan[0].innerHTML);
        var rightYear = parseInt(aNextSpan[1].innerHTML);
        
        aNowSpan[0].parentNode.onclick = function(){
            
        //var leftMonth = parseInt(aNowSpan[0].innerHTML);
        //var leftYear = parseInt(aNowSpan[1].innerHTML);
        //var rightMonth = parseInt(aNextSpan[0].innerHTML);
        //var rightYear = parseInt(aNextSpan[1].innerHTML);

            if(leftMonth == 12){
                showDate(oNowTime,leftYear-1,leftMonth,true);
                showDate(oNextTime,leftYear,1);
            }
            else{
                showDate(oNowTime,leftYear,leftMonth,true);
                showDate(oNextTime,leftYear,leftMonth+1);
            }
            
            //showBtn();
            showColor(new Date().getDate());
        };
        
        aNextSpan[0].parentNode.onclick = function(){
            
            if(rightMonth == 1){
                showDate(oNowTime,rightYear,12,true);
                showDate(oNextTime,rightYear+1,rightMonth);
            }
            else{
                showDate(oNowTime,rightYear,rightMonth-1,true);
                showDate(oNextTime,rightYear,rightMonth);
            }
            
            showBtn();
            showColor(new Date().getDate());
            
        };
        
    }
    
};
</script>
</head>

<body>
<input type="text" /><input type="text" /><input type="button" value="确定" />
<div id="div1">
    <div id="nowTime">
        <!--<div class="title">
            <div class="l"><span>3</span>月</div>
            <div class="c"><span>2000</span>年<span>3</span>月</div>
        </div>
        <table>
            <thead>
                <tr>
                    <th>周一</th>
                    <th>周二</th>
                    <th>周三</th>
                    <th>周四</th>
                    <th>周五</th>
                    <th class="red">周六</th>
                    <th class="red">周日</th>
                </tr>
            </thead>
            <tbody>
                   <tr>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                </tr>
                <tr>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>
                        1
                        <p>200元</p>
                    </td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                </tr>
            </tbody>
        </table>-->
    </div>
    <div id="nextTime">
        <!--<div class="title">
            <div class="r"><span>3</span>月</div>
            <div class="c"><span>2000</span>年<span>3</span>月</div>
        </div>
        <table>
            <thead>
                <tr>
                    <th>周一</th>
                    <th>周二</th>
                    <th>周三</th>
                    <th>周四</th>
                    <th>周五</th>
                    <th class="red">周六</th>
                    <th class="red">周日</th>
                </tr>
            </thead>
            <tbody>
                   <tr>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                </tr>
                <tr>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>
                        1
                        <p>200元</p>
                    </td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                </tr>
            </tbody>
        </table>-->
    </div>
</div>
</body>
</html>
马斯塔的主页 马斯塔 | 初学一级 | 园豆:124
提问于:2015-01-20 21:40
< >
分享
所有回答(2)
0

没有发现你说的问题

bjtqti | 园豆:202 (菜鸟二级) | 2015-01-20 23:04

要先把递归注释掉,你在看看

支持(0) 反对(0) 马斯塔 | 园豆:124 (初学一级) | 2015-01-21 20:02

@马斯塔: 

因为没有注释之前,aNowSpan[0]每次都是取得更新后的月份(即新创建的节点),而放开注释之后,取到的永远都是固定的。
 如果还不懂,就加我QQ278500368吧

支持(0) 反对(0) bjtqti | 园豆:202 (菜鸟二级) | 2015-01-21 21:48
0

兼容?

_Vegetables | 园豆:586 (小虾三级) | 2015-01-21 10:25
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册