網頁

2013年10月22日 星期二

Javascript學習筆記-取代所有相關字串

想取代整個字串中所有特定字,但javascript沒有支援,找了下看到用regular expression方式也行,都忘了有這方法,做下紀錄

ex : replaceAll 小數點
var s1 = "A.B.C";
alert(s1.replace(/\./g,"_")); // "A_B_C"

參考網址:
[javascript] Javascript 的 replaceAll

2013年10月4日 星期五

jQuery開發筆記-jQuery Validate及ie 7的相容問題

需求
  1. 表單填資料,表單所在頁面是html,所以只能用javascript
  2. 送出要檢查必填及勾選個資使用同意
  3. 資料轉成mail寄出
  4. 相容到IE 7
需求是很簡單,但若只能用javascript,相容到IE 7就是個大問題,我檢查資料用的是jquery validate這個plugin,似乎也加重這問題,要比較後面的版本才相容,但jquery越後面的版本就越是放棄相容舊的IE,最後是總結如下:
  1. 使用jQuery 1.6.1
  2. 使用jQuery validate 1.8.1(在這jquery 1.8.1 download可以下載)
jQuery validate 1.8.1在選擇要檢查的element跟jQuery validate 1.11.1不同,例如:
jQuery validate 1.8.1: <input type="text" value="" class="required" />
jQuery validate 1.11.1: <input type="text" value="" required />

使用上jQuery validate 1.11.1比較方便,但相容性只到IE 8(使用jQuery 1.7.2的情況下)。

設定上也很容易,大概如下使用,可以在按下submit後,檢查下有
$('#myform').validate({

    submitHandler:function(form){
        //驗證成功準備要submit前
        if( !$('#check').prop('checked') ) alert('請勾選');
        else {
            //這邊我用ajax
            $.ajax({
                url: "mail.php", //自己寫好的mail,phpMail寫的
                async:false,
                type: "POST",
                data: $( "#myform" ).serialize(),
                success: function(data) {
                    alert(data);
                    $( "#myform" )[0].reset();
                }
            });
        }
    },
    messages: {
        //針對name及tel,指定沒填時要顯示的提示
        name: { required: ' 請輸入'},
        tel: { required: ' 請輸入'}
    }
});

相對應的element如下
<form id="myform" method="post" action="">
<input type="text" name="name" class="required">
<input type="text" name="tel" class="required">
</form>


css可以改成這樣(取自jQuery Validation Plugin Demo的demo)
<style type="text/css">
    label.error, label.error {
        color: red;

        font-style: italic;
    }
    input.error, textarea.error, checkbox.error {
        border: 2px dotted red;

    }
</style>


最後要將form的資料reset,要用$('#myform')[0].reset(),這樣才能正常抓到form這個element,因為$('#myform')是jQuery的物件,而reset()是Element的function


jQuery plugin Validation的7個Callback介紹
jQuery Validation Plugin Demo
jQuery Validation Plugin
jQuery Validation not working in IE7 + IE8

form reset
How to reset (clear) form through javascript?

2013年10月3日 星期四

[Block] xxxxxxxxxx ran insecure content from http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css

出現這種奇怪的問題,例如:
[Block] xxxxxxxxxx ran insecure content from http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css

主要原因是明明正在https中,script link卻在http,這狀況其實只要將"http:"這串字拿掉,留下//ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css,這樣就不會有這個error出現了

參考網址:
HTTPS-friendly jQuery CSS theme from Google CDN