新手工程師的小小心得

这个是用javascript控制的。非常简单。复制到body里面试下。 <style> a.select{color:#F00};/*选中的样式*/ </style> <script> function left_btn(n) { var a_num=document.getElementById("left_btn_box").getElementsByTagName("a"); for(i=0;i<a_num.length;i++) { a_num[i].className=i==n?"select":""; } } </script> <div id="left_btn_box"> <a class="select" onclick="left_btn(0)" href="#">按钮1</a> <a onclick="left_btn(1)" href="#">按钮2</a> <a onclick="left_btn(2)" href="#">按钮3</a> </div> 參考網址： http://zhidao.baidu.com/question/265450594.html

限定只能輸入數字，而且像是輸入信用卡一樣，輸入滿字元就自動跳轉 輸入西元年滿四個數字，自動跳轉（focus)到下一個欄位（ID） 自動跳轉 onkeyup="if(this.value.length==字數)document.getElementById('ID').focus(); 限定輸入數字(注意一下，在『,』後面是兩個『'』不是一個『"』) onkeyup="value=value.replace(/[^\d]/g,'') " EX： <input id="birthYear" type="text" class="input_line ipxxs" placeholder="西元年" maxlength="4"   onkeyup="if(this.value.length==4)document.getElementById('birthMonth').focus();value=value.replace(/[^\d]/g,'') "> <span style="float: left;">-</span> <input id="birthMonth" type="text" class="input_line ipxxs" placeholder="西元月" maxlength="2"   onkeyup="if(this.value.length==2)document.getElementById('birthDay').focus();value=value.replace(/[^\d]/g,'') "> 參考限定輸入類型 http://dennis1985.pixnet.net/blog/post/121634578-html-text...

CSS 完全置中的寫法 position: fixed;     z-index: 2000;     background: rgba(0, 0, 0, 0.7);     display: block;     top: 0px;     left: 0px;     bottom: 0px;     overflow: auto;     width: 100%;

$( ".grpCbx" ).click(function() { $( ".grpCbx" ).not( this ).removeAttr( "checked" ); }); 將其他check清空，使用專屬jquery的 .not(this) 來處理 原出處 http://blog.darkthread.net/post-2009-05-29-something-about-js-event.aspx

要完全置中（上下左右） < style > . dialogbox { top : 0 ; left : 0 ; bottom : 0 ; right : 0 ; margin : auto ; overflow : auto ; } </ style > 在ajax的運用中使用，用途為若api未回傳資料回來，就插入畫面擋住不讓用戶一直點擊 CSS div . loadingdiv { height : 100 %; /*100% 覆蓋網頁內容 , 避免 user 在 loading 時進行其他操作 */ width : 100 %; position : fixed ; z-index : 99999 ; /* 須大於網頁內容 */ top : 0 ; left : 0 ; display : block ; background : #000 ; opacity : 0.6 ; text-align : center ; } div . loadingdiv img { position : relative ; vertical-align : middle ; text-align : center ; margin : 0 auto ; margin-top : 50 vh ; } Ajax 主要是在beforeSend跟complete這兩個function 若開始執行 show，若完成就hide。 AjaxCall : function ( urlStr , object , callback ) { console. log ([ urlStr , object ]); $ . ajax ({ url: urlStr , type: "GET" , data: object , dataType: "json" , suc...

以前都是用for迴圈再做東西，但是後來發現有一些同事都是使用each來作業 便在今天試著使用了一下each來做api串接 一維的for基本型態 for ( var i = 0 ; i < FateDataRange_Array .length; i++) {} 一維的each作法 $. each (FateDataRange_Array, function ( i , object ){ console. log ( i + ' = ' + object ); }); 二維的for基本型態 for ( var i = 0 ; i < data .GetCountryListResult.KVLlists.length; i++) { data .GetCountryListResult.KVLlists[i]. key data .GetCountryListResult.KVLlists[i]. val } 二維的each作法 $. each ( data .GetCountryListResult.KVLlists, function ( i , object ) { console. log ( i + ' = ' + object . key + ' = ' + object . val ); console. log ( data .GetCountryListResult.KVLlists.length);//長度 }); 參考資料： http://g2room.com/index.php/archives/62 http://www.g2room.com/jquery/example/base/each.html

jQuery獲取Select選擇的Text和Value(轉)     jQuery獲取Select選擇的Text和Value: 語法解釋： 1. $("#select_id").change(function(){//code...}); //為Select添加事件，當選擇其中一項時觸發 2. var checkText=$("#select_id").find("option:selected").text(); //獲取Select選擇的Text 3. var checkValue=$("#select_id").val() ; //獲取Select選擇的Value 4. var checkIndex=$("#select_id ").get(0).selectedIndex; //獲取Select選擇的索引值 5. var maxIndex=$("#select_id option:last" ).attr("index"); //獲取Select最大的索引值 jQuery設置Select選擇的Text和Value: 語法解釋： 1. $("#select_id ").get(0).selectedIndex=1; //設置Select索引值為1的項選中 2. $("#select_id ").val(4); //設置Select的Value值為4的項選中 3. $("#select_id option[text='jQuery' ]").attr("selected", true); //設置Select的Text值為jQuery的項選中 jQuery添加/刪除Select的Option項： 語法解釋： 1. $("#select_id").append("<option value='Value'>Text</option>"); //為Select追加一個Option(下拉項) 2. $("#se...