顯示具有 Return 標籤的文章。 顯示所有文章
顯示具有 Return 標籤的文章。 顯示所有文章

2020年1月2日 星期四

Javascript入門必學16三種訊息框

Javascript入門必學的三種訊息框!


Javascript入門必學的三種訊息框!



JavaScript 中提供了三種訊息框,有alert、confirm、prompt,三種訊息框的介紹如下:

Alert警告提示框

當前端工程師要確保信息確實傳遞給用戶時,就可以使用 Alert 警告提示框。JavaScript 的訊息框提供了一個「確定」按鈕,可以讓使用者關閉該訊息框後才可以繼續進行操作。
Alert 警告提示框採用單個參數,即彈出框中顯示的文字,如下例子:

alert("Do you really want to leave this page?");

prompt提示訊息框

JavaScript 的 prompt 提示訊息框用於讓用戶在進入頁面之前,必須先輸入訊息。
當 prompt 提示訊息框跳出時,用戶在輸入訊息後必須點擊「確定」或「取消」才能繼續。
如果用戶點擊「確定」,該框將顯示使用者輸入的訊息如果用戶單擊「取消」,則顯示「null」
如下例子,當使用者進入網頁時,網頁就會跳出一個 prompt提示訊息框,訊息框上顯示「你今年幾算?」,然後讓使用者輸入數字。若使用者輸入歲數並且按下「確定」後,訊息框將會顯示「你今年_歲」;若使用者沒有輸入訊息或是按「取消」,則顯示「你今年null歲」。

// result = prompt(確認訊息框顯示問題);
let age = prompt('你今年幾算?');

alert(`你今年 ${age} 歲!`); // 你今年_歲!

confirm確認訊息框

JavaScript 的 confirm 確認訊息框通常用於讓用戶驗證或接受某些內容。
彈出confirm確認訊息框時,用戶必須點擊「確定」或「取消」才能繼續。
如果用戶單擊「確定」,則該框將回傳 true。如果 用戶單擊「取消」,則該框將回傳 false。
如下例子,當使用者進入網頁時,網頁就會跳出一個 confirm 確認訊息框,訊息框上顯示「請問你確定要離開此頁嗎?」,然後讓使用者輸入「確定」或「取消」。若使用者輸入「確定」後,訊息框將會顯示「感謝您的造訪,再見!」;若使用者沒有輸入訊息或是按「取消」,則顯示「感謝您選擇繼續瀏覽我們的網頁!」。

var result = confirm("請問你確定要離開此頁嗎?");
if (result == true) {
  alert("感謝您的造訪,再見!");
}
else {
  alert("感謝您選擇繼續瀏覽我們的網頁!");
}

相關文

Javascript入門必學13函式的參數

Javascript入門必學14函式中的多重參數

Javascript入門必學15函式回傳

JavaScript學堂3.資料類型

Javascript新手上路(七):條件陳述式

JavaScript入門教學看這裡!(5)賦值運算子

JavaScript葵花寶典入門現世(C)

2天考取Google Ads證照!新手廣告投放攻略

擺脫設備工程師血汗職涯, 零基礎的我成功轉職 Python 資料工程師

44歲媽咪順利轉職網頁設計師, 家庭事業都得意

零基礎如何花 14 小時考取 GoogleAds 認證? 五種 GoogleAds 廣告不藏私攻略

從無到有-挑戰14小時取得Google證照

2019年12月26日 星期四

Javascript入門必學15函式回傳

Javascript初學者必學,別漏了"函式回傳"!


Javascript初學者必學,別漏了"函式回傳"!


JavaScript 函式(function)如果進行需要結果的計算時,可以選擇return 語句,讓 函式 回傳結果,這個語句非常有用。
JavaScript 執行到 return 語句時, 函式 則會停止執行。
return 語句可用來回傳結果。如下例,對兩個數值 x,y 進行運算後回傳結果

如果你不從函式回傳任何內容,它將回傳為 undefined。例如,我們將上述的例子中,「return a * b;」改為「return;」,則結果如下面所示:

return 語句要寫在函式定義的最後方,另一個 return 語句的範例如下:


相關文章

Javascript入門必學8條件判斷式

Javascript入門必學9-for迴圈

Javascript入門必學10 while和do while迴圈

Javascript基礎入門(二):變數

語言程式Java還真的是咖啡名字!快看其他程式語言的名字故事!

電影中藏了Python和Java,你有發現嗎?解析看這裡(下) 

讓你實現目標與夢想的技術實力-Java課程

2天考取Google Ads證照!新手廣告投放攻略

擺脫設備工程師血汗職涯, 零基礎的我成功轉職 Python 資料工程師

44歲媽咪順利轉職網頁設計師, 家庭事業都得意

零基礎如何花 14 小時考取 GoogleAds 認證? 五種 GoogleAds 廣告不藏私攻略

從無到有-挑戰14小時取得Google證照