Night Wind's

網頁阻止IE相容性檢視語法

11/04/2014Coding_Web, jQuery Mobile

之前發現自己寫的 jQuery Mobile 網頁在 IE 上會異常。追半天才發現是網站被加入相容性檢視，強制以 IE6 的結果自然是無法呈現 jQuery Mobile 語法了。

解決的方法是在 <head> </head> 中加入這一行程式碼：

意即使用 IE 來到此網頁時，需以實際的版本或 Chrome 檢視。

其餘相關語法，例如強制相容 IE6 ，請參考：【HTML教學】X-UA-Compatible設置IE兼容模式

繼續閱讀

和歌壽司

10/21/2014吃吃喝喝

之前提到公司附近一家偽日式餐廳，開幕不到三個月後關門大吉。 (食記：上田日式定食)

沉寂一段時間後，又開了新的日式餐廳：和歌壽司 (Waka sushi)

以一般上班區域餐廳來說並不平價，但食材用的很好。

手機拍的菜單：

飲料是羅漢果茶。

老婆點的日本綜合魚天丼。

我的天丼，味噌湯裡有不同的魚片，很豐富。中間小碗是醬汁，直接淋在丼飯上。

小方盤是十月底之前，慶開幕送的80元炸蝦，配著盤中的胡椒鹽很不錯。小圓盤應該是岩鹽，口感也很棒！

丼飯很豐富，連干貝也炸下去了。份量很大碗，一碗199塊扣除成本老實說沒賺多少，是一個滿適合請客吃飯的地點。只是單點不要點太多，會大失血！

店名：和歌壽司 (Waka Sushi)
地址：台北市重慶南路一段66號一樓

繼續閱讀

Mac 取消滑鼠右鍵選單 CleanMyMac 項目

8/22/2014Apple, Mac

CleanMyMac 是一套滿好用的空間整理程式。但平常點選右鍵要編輯檔案時，會多出兩個我不太會去用的功能：Securely Erase with CleanMyMac 、 Erase with CleanMyMac。

剛看到一篇 VICJHT 網友分享的文章：如何取消蘋果電腦右鍵裏頭不需要的服務選單，解決了我的問題，也一併分享給大家！

首先，在  點選系統偏好設定，再點選鍵盤。

在快速鍵頁中，點選服務。將 Erase with CleanMyMac 和 Securely Erase with CleanMyMac 取消勾選即可。

繼續閱讀

Node.js 使用網頁更新MongoDB資料

8/20/2014MongoDB, Node.js

需要安裝下列 module:
npm install express
npm install mongodb
npm install --save body-parser

var express = require('express');

var MongoClient = require('mongodb').MongoClient
    , format = require('util').format;    

/*
 * body-parser is a piece of express middleware that 
 *   reads a form's input and stores it as a javascript
 *   object accessible through `req.body` 
 *
 * 'body-parser' must be installed (via `npm install --save body-parser`)
 * For more info see: https://github.com/expressjs/body-parser
 */
var bodyParser = require('body-parser');

// create our app
var app = express();

// instruct the app to use the `bodyParser()` middleware for all routes

//app.use(bodyParser()); // 原寫法會有錯誤訊息，改以下面寫法：
//------------------------------
app.use(bodyParser.urlencoded({
  extended: true
}));

app.use(bodyParser.json())
//------------------------------

// A browser's default method is 'GET', so this
// is the route that express uses when we visit
// our site initially.
app.get('/', function(req, res){
  // The form's action is '/' and its method is 'POST',
  // so the `app.post('/', ...` route will receive the
  // result of our form
  var html = '<form action="/" method="post">' +
               '身份證號:' +
               '<input type="text" name="uid" placeholder="A123456789" />' +
               '<br>' +
               '到期日:' +
               '<input type="text" name="afterDate" placeholder="2014/01/01" />' +
               '<br>' +
               '<button type="submit">送出</button>' +
            '</form>';
               
  res.send(html);
});

// This route receives the posted form.
// As explained above, usage of 'body-parser' means
// that `req.body` will be filled in with the form elements
app.post('/', function(req, res){
  var uid = req.body.uid;
  var afterDate = req.body.afterDate;

  if (uid != '' & afterDate != '') {
    console.log(uid.toUpperCase()); // 加.toUpperCase()強制大寫
    console.log(afterDate);

    MongoClient.connect('mongodb://10.0.1.1:27017/mydb', function(err, db) {
    if(err) throw err;

    db.collection('mycollection').update({name: uid.toUpperCase()}, {$set: {"data1.after": afterDate, "data2.after": afterDate}}, function(err) {
        if (err) console.warn(err.message);
        else console.log('successfully updated');
        db.close();
      });

    });
  };  

  var html = '送出資料如下<br> <br>' + 
             '身分證號: ' + uid.toUpperCase() + '<br>' +
             '到期日: ' + afterDate + '<br>' +
             '<a href="/">回上頁</a>';
  res.send(html);
});

app.listen(80);

在terminal執行這個js程式即可。(80port在mac需要使用sudo才能跑)

畫面：

參考資料：example reading form input with express 4.0 and body parser for node js

繼續閱讀

Node.js 使用 FTP 傳送檔案

8/19/2014Node.js

先安裝 FTP 模組： npm install ftp

node.js程式如下：

  var Client = require('ftp');
  var fs = require('fs');

  var c = new Client();

  c.connect({
   host: "10.0.1.1",
   user: "test",
   password: "test"
  });

  c.on('ready', function() {
    c.put('BackupLog.txt', 'Remote/BackupLog.txt', function(err) {
      if (err) throw err;
      c.end();
    });
  });

繼續閱讀

使用 Node.js 執行外部壓縮程式與外部指令

8/15/2014Node.js

4~9: 執行壓縮指令，壓縮完畢跳到 code:11

11~17: 執行 xcopy 指令

var exec = require('child_process').exec,
    child; 
 
child = exec('"C:\\Program Files\\7-zip\\7zG.exe" a -r -mx9 "BackupLog.7z" "BackupLog.txt"', function(error, stdout, stderr) {
    console.log('stdout: ' + stdout);
    console.log('stderr: ' + stderr);
    if (error !== null) {
        console.log('exec error: ' + error);
    }
 
    exec('xcopy "BackupLog.7z" \\\\10.0.1.1\\test /y', function(error, stdout, stderr) {
        console.log('stdout: ' + stdout);
        console.log('stderr: ' + stderr);
        if (error !== null) {
            console.log('exec error: ' + error);
        }
    });
});

繼續閱讀

Node.js 取得上個月的日期字串

8/06/2014Node.js

取年份要使用 getFullYear()才會有完整正確的數字。

如果要取當月，因為月份的算法是0~11，需改為(MyDate.getMonth()+1)。

var MyDate = new Date();
var MyDateString;

MyDateString = MyDate.getFullYear() + '/' + ('0' + MyDate.getMonth()).slice(-2);

console.log(MyDateString);

結果：

Ians-MBP:Desktop ian$ node LastMonth.js
2014/07

取前一天：

var MyDate = new Date();
var MyDateString;

MyDate.setDate(MyDate.getDate() - 1); // 取前一日，自行依備份日期調整

MyDateString = MyDate.getFullYear() + '/' + ('0' + (MyDate.getMonth()+1)).slice(-2) + '/' + ('0' + MyDate.getDate()).slice(-2);  //日期補零 2014/08/16

原有取得的日期沒有補0，因此才有加0和slice(-2)的轉換，原理如下。(原文網址：http://stackoverflow.com/questions/3605214/javascript-add-leading-zeroes-to-date)

To explain, .slice(-2) gives us the last two characters of the string.

So no matter what, we can add "0" to the day or month, and just ask for the last two since those are always the two we want.

So if the MyDate.getMonth() returns 9, it will be:

("0" + "9") // Giving us "09"

so adding .slice(-2) on that gives us the last two characters which is:

("0" + "9").slice(-2)
"09"

But if MyDate.getMonth() returns 10, it will be:

("0" + "10") // Giving us "010"

so adding .slice(-2) gives us the last two characters, or:

("0" + "10").slice(-2)
"10"

繼續閱讀

網址傳送資料給 Node.js (app.get)

8/05/2014Node.js

Node.js 需安裝 express 模組。 (sudo npm install express)

再撰寫以下程式碼，檔案自訂。

App.js

var express = require('express');
var app = express();

app.get('/data', function(req, res) {
    console.log(req.query.name);
    console.log(req.query.country);
    res.send('Name:' + req.query.name + '<br />' +'Country:' + req.query.country);
    res.end();

});


app.listen(12345);

Terminal 執行 node app.js

使用瀏覽器，網址輸入 http://127.0.0.1:12345/data?name=Ian&country=Taipei

Terminal 會顯示網址所帶的參數：

Ians-MBP:Desktop ian$ node app.js
Ian
Taipei

網頁顯示如下：

繼續閱讀

Ajax-Loader 測試

7/15/2014jQuery Mobile

在做 jQuery Mobile 時，可能會碰到 mobileinit 事件。以下是模擬 A網頁前往 B網頁，可在B網頁加上載入三秒鐘的資料，藉以得知loading的狀態或圖示。

<script runat="server">
 
  protected void Page_Load(object sender, EventArgs e)
  {
    System.Threading.Thread.Sleep(3000);
  }

</script>

繼續閱讀

勾選我同意後，出現「下一步」按鈕，可指往第二頁。

7/12/2014jQuery Mobile

當點選我同意時，顯示「下一步」。按「下一步」時導到第二頁。

<!DOCTYPE html>
<html>
<head>
 <title>Agree check</title>
 
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 
 <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.min.css" />
 <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
 <script src="http://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.min.js"></script>
 
 <script type="text/javascript">
  $(document).on("change", "#checkbox-agree", function () {
      if ($(this).prop("checked")) {
          $("#NextPage").button("enable");
      } else {
          $("#NextPage").button("disable");
      }
  });
 </script>
</head>
 
<body>
 
<div data-role="page" id="Page1">
 <div data-role="fieldcontain">
     <fieldset data-role="controlgroup" style="width:150px">
      <input type="checkbox" name="checkbox-agree" id="checkbox-agree" class="custom" />
      <label for="checkbox-agree">我同意</label>
     </fieldset>
     <input type="button" id="NextPage" data-inline="true" onclick="javascript:location.href='#Page2'"  value="下一步" disabled/>
 </div>
</div>
 
<div data-role="page" id="Page2">
 This is Page2.
</div>
 
</body>
</html>

繼續閱讀

熱門文章