欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区

利用My97DatePicker實(shí)現(xiàn)年份多選-創(chuàng)新互聯(lián)

昨天,咱們嘗試使用Kalendae實(shí)現(xiàn)年份的多選事件,結(jié)果發(fā)現(xiàn),該插件不能實(shí)現(xiàn)月份以及年份的選擇,更不必說(shuō)年份的多選的事件了。筆者也不愿多做深究,既然My97DatePicker可以定義選擇年份,何不簡(jiǎn)單的改寫(xiě)改寫(xiě)它。筆者秉著這個(gè)思路,繼續(xù)往皮毛之下探索。
先看一下My97DatePicker的習(xí)性,俗語(yǔ)講知己知彼,是吧。這個(gè)插件調(diào)用之后會(huì)改變調(diào)用位置的顯示內(nèi)容為當(dāng)前選擇日期。而且還可以給點(diǎn)擊位置之外的地方,賦值(筆者就準(zhǔn)備利用這點(diǎn))。
一、通過(guò)My97DatePicker自帶img

成都創(chuàng)新互聯(lián)公司服務(wù)熱線(xiàn):13518219792,為您提供成都網(wǎng)站建設(shè)網(wǎng)頁(yè)設(shè)計(jì)及定制高端網(wǎng)站建設(shè)服務(wù),成都創(chuàng)新互聯(lián)公司網(wǎng)頁(yè)制作領(lǐng)域十余年,包括iso認(rèn)證等多個(gè)方面擁有豐富的網(wǎng)站營(yíng)銷(xiāo)經(jīng)驗(yàn),選擇成都創(chuàng)新互聯(lián)公司,為網(wǎng)站保駕護(hù)航!
<input readonly="readonly" id="real_function_position" onpropertychange="get_real_select_year()" ><!-- 根據(jù)變化的時(shí)間,函數(shù)位置 -->
    <img  onclick="WdatePicker({el:$dp.$('real_function_position'),dateFmt:'yyyy'})" src="My97DatePicker/skin/datePicker.gif"><!-- 點(diǎn)擊時(shí)間的位置 -->

二、通過(guò)My97DatePicker插件重新賦值的事件,定義多選函數(shù)

var already_select_year = [];//已將選擇的年份數(shù)組,若存在刷新當(dāng)前。此處的初始值應(yīng)為,封裝數(shù)據(jù)所得。并且初始化加載時(shí),應(yīng)同步顯示已選擇的年份。
            function get_real_select_year(){
                var nowYear = $("#real_function_position").val();
                //判斷,當(dāng)前年份是否為空
                if(nowYear != null & nowYear != ''){
                    //判斷,當(dāng)前年份,是否在選的數(shù)組中
                    var index = $.inArray(nowYear, already_select_year);
                    if(index > -1){//含有該列,則不做處理
                        return;
                    }else{//展示,用戶(hù)的選擇。并數(shù)組存儲(chǔ)
                        already_select_year.push(nowYear);
                        //展示
                        document.getElementById("show_user_select").innerHTML +=
                            "<span id="+ nowYear +">" + nowYear + "<img onclick='delete_select("+ nowYear +")' src=''> </span>"
                    } 
                }else{
                    return;
                }
            }

三、年份選擇后的刪除

//刪除,當(dāng)前所選年份事件
            function delete_select(id){
                //數(shù)組中除去,該元素
                delete_shuzu(already_select_year, id);
                //清除,用戶(hù)輸入顯示
                $("#"+ id).remove();
            }
            //刪除數(shù)組中的元素
            function delete_shuzu(arry, obj){
                for (var i = 0; i < arry.length;  i++){
                    if(arry[i] == obj){
                        arry.splice(i, 1);
                        break;
                    }       
                }
            }

四、貼出整體代碼

 <!DOCTYPE html>
        <html>
            <head>
                <meta charset="UTF-8">
                <title>My97DatePicker實(shí)現(xiàn)年份多選</title>
            </head>
                <script type="text/javascript" src="js/jquery.js" ></script>
                <script type="text/javascript" src="My97DatePicker/WdatePicker.js" ></script>
            <style>
                .select_year{position: relative;}
                .select_year input{position: absolute; left: 8px; top: 0px;}
            </style>
            <body>
                <div id="show_user_select" ></div><!-- 選擇時(shí)間后,的顯示位置 -->
                <div class="select_year">
                    <!--若IE低版本,有一個(gè)×××警告錯(cuò)誤“不可見(jiàn)的控件,無(wú)法獲取其焦點(diǎn)...”
                    那么請(qǐng)將real_function_position的type="text",本文這里已將該輸入框位置置于img圖形之下
                    onpropertychange只是配IE瀏覽器,此處針對(duì)不同類(lèi)型的瀏覽器應(yīng)該判斷瀏覽器執(zhí)行不同的事件
                    例如:oninput 事件等            -->
                    <input readonly="readonly" type="hidden" id="real_function_position" onpropertychange="get_real_select_year()" ><!-- 根據(jù)變化的時(shí)間,函數(shù)位置 -->
                    <img  onclick="WdatePicker({el:$dp.$('real_function_position'),dateFmt:'yyyy'})" src="My97DatePicker/skin/datePicker.gif"><!-- 點(diǎn)擊時(shí)間的位置 -->
                </div>
            </body>
            <script>
                var already_select_year = [];//已將選擇的年份數(shù)組,若存在刷新界面。此處的初始值應(yīng)為,封裝數(shù)據(jù)所得
                function get_real_select_year(){
                    var nowYear = $("#real_function_position").val();
                    //判斷,當(dāng)前年份是否為空
                    if(nowYear != null & nowYear != ''){
                        //判斷,當(dāng)前年份,是否在選的數(shù)組中
                        var index = $.inArray(nowYear, already_select_year);
                        if(index > -1){//含有該列,則不做處理
                            return;
                        }else{//展示,用戶(hù)的選擇。并數(shù)組存儲(chǔ)
                            already_select_year.push(nowYear);
                            //展示
                            document.getElementById("show_user_select").innerHTML +=
                                "<span id="+ nowYear +">" + nowYear + "<img onclick='delete_select("+ nowYear +")' src='img/false.png'> </span>"
                        } 
                    }else{
                        return;
                    }
                }
                //刪除,當(dāng)前所選年份事件
                function delete_select(id){
                    //數(shù)組中除去,該元素
                    delete_shuzu(already_select_year, id);
                    //清除,用戶(hù)輸入顯示
                    $("#"+ id).remove();
                }
                //刪除數(shù)組中的元素
                function delete_shuzu(arry, obj){
                    for (var i = 0; i < arry.length;  i++){
                        if(arry[i] == obj){
                            arry.splice(i, 1);
                            break;
                        }       
                    }
                }
                </script>
        </html>

五、實(shí)現(xiàn)效果
利用My97DatePicker實(shí)現(xiàn)年份多選
筆者認(rèn)為,定會(huì)有比這更好的實(shí)現(xiàn)方式。或者筆者寫(xiě)的還有未知的bug,期待有興趣的人繼續(xù)探究。筆者現(xiàn)在在想,不玩游戲干點(diǎn)啥呢。

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內(nèi)外云服務(wù)器15元起步,三天無(wú)理由+7*72小時(shí)售后在線(xiàn),公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性?xún)r(jià)比高”等特點(diǎn)與優(yōu)勢(shì),專(zhuān)為企業(yè)上云打造定制,能夠滿(mǎn)足用戶(hù)豐富、多元化的應(yīng)用場(chǎng)景需求。

分享標(biāo)題:利用My97DatePicker實(shí)現(xiàn)年份多選-創(chuàng)新互聯(lián)
分享鏈接:http://chinadenli.net/article0/dgpcio.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供App開(kāi)發(fā)、面包屑導(dǎo)航、做網(wǎng)站網(wǎng)站設(shè)計(jì)公司、網(wǎng)站制作、網(wǎng)站策劃

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話(huà):028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

外貿(mào)網(wǎng)站制作