Exploring and Thinking

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

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

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

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

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

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

和歌壽司


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

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

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

手機拍的菜單:






飲料是羅漢果茶。


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


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


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

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

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

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

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


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

首先,在點選系統偏好設定,再點選鍵盤

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

Share:

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

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

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
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
Share:

Node.js 使用 FTP 傳送檔案

先安裝 FTP 模組: npm install ftp

node.js程式如下:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
  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();
    });
  });
Share:

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

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

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
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);
        }
    });
});
Share:

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

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

如果要取當月,因為月份的算法是0~11,需改為(MyDate.getMonth()+1)。
1
2
3
4
5
6
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

取前一天:

1
2
3
4
5
6
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"
Share:

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

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

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

App.js

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
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

網頁顯示如下:

Share:

Ajax-Loader 測試

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

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

</script>
Share:

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

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



<!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>
Share:

負評 - 好味 港式‧燒蠟

公司同仁推薦一家用餐時間大排長龍的港式燒臘店,希望能集體訂購。

前一天,同事去店裡拿名片,詢問是否可外送?店員回答只接一千二以上、走路十分鐘可到的訂單。同事說滿近的,隔天會電話訂購。


早上九點,另一名同事說之前訂這家便當遭遇不好的經驗。八點多打過去時,店員要他11點再打,等11點店員又說外送單滿了,得自己去拿。

我說可能那天單比較多,才會有這種情況,於是立刻打電話過去。

第一次得先打四通才能正常通話,因為第一通店員聽到外送,就立刻說「喂、喂~ 」掛掉。我要等半分鐘再打才接起來回答:「我們現在不接單,接單小姐要10:45才會來」。

我說10:45太晚了,能不能早點接我的單?對方說:「我不接單、你晚點再打過來。」

等到快十點,打電話過去被掛兩次才被接起,店員反問我:「我不是說10:45再打嗎?」隨即掛掉電話。

到10:40又打電話,等了快兩分鐘才有人接聽,然後說:「接單的小姐外出了,晚點我請她打電話給你」。

留了電話後,到10:55還沒來電。我打過去詢問的結果是:「你要外帶嗎?外送滿了喔!」

我說:「你不是叫我這時候打過來嗎?為什麼9點不跟我說,等11點才回答只能外帶?」

店員:「剛不是我接電話,單子兩天前就滿了。」

奇怪,昨天同事去拿名片時沒提滿單,接電話的也明明是同一個人,卻說是不同人。

我說:「那你剛為什麼不打電話聯絡我?你們這樣耍人是做生意的規距嗎?」

店員:「我剛有打電話啊,可是你電話不通。」

我說:「我電話一定會有人接,我忙線中時電話會轉到同事那裡。」

店員一見謊言被揭穿就不講話,我又說:「那你要我怎麼跟大家交待中午的便當?你們做生意的SOP是這樣嗎?」

店員:「我們是小吃店,沒有所謂的SOP。」

我聽完後就掛電話了,無法接受一個生意不講誠信的店家。

好味的一貫技倆:

  1. 故意說11點才能接單,不讓你有轉訂別間的機會。
  2. 可以訂單時,說食材不足,只能外帶不能外送。簡單邏輯問題,備料不足無法外送,改外帶馬上就有便當出。天底下有這種做生意的態度嗎?今天不想外送,為何要給個外送專線,再強迫顧客自己去拿呢?
同樣的價格我推薦最近常訂的原味便當,美味之外也很健康。

第一次訂原味便當,因為事後額外加訂,導致外送人員少帶一個便當。店員來電詢問是否肯等半小時,他們可以為了一個便當再從敦化南路送來重慶南路。

有機的飯、菜,負責任的外送服務可選。大家又何必找一個沒有誠信的店家,吃冷菜冷飯的燒蠟?

好味 港式‧燒蠟,應該是我永遠的拒絕往來戶了吧。
Share:

熱門文章

標籤