JavaScript prompt()
呼叫此方法可以彈出一個對話方塊, 此對話方塊具有文字輸入功能,且具有確定和取消按鈕。
兩個按鈕的具體功能後面會有程式碼例項演示。
prompt方法與alert和confirm兩個方法類似。
異同點如下:
(1).都可以彈出一個框。
(2).prompt方法彈出的框具有文字輸入功能,alert和confirm不能輸入文字。
更多window物件內容參閱JavaScript window 物件一章節。
特別說明:window物件方法都可以直接使用,無需使用window呼叫。
語法結構:
[JavaScript] 純文字檢視 複製程式碼prompt(text,defaultText)
引數解析:
(1).text:可選,對話方塊的提示文字,通常用於對使用者輸入文字內容的提示。
(2).defaultText:可選,預設輸入的文字內容。
瀏覽器支援:
(1).IE瀏覽器支援此方法。
(2).edge瀏覽器支援此方法。
(3).谷歌瀏覽器支援此方法。
(4).opera瀏覽器支援此方法。
(5).火狐瀏覽器支援此方法。
(6).safria瀏覽器支援此此方法。
程式碼例項:
[HTML] 純文字檢視 複製程式碼執行程式碼<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <script> window.onload = function () { let odiv = document.getElementById("ant"); let obt=document.getElementById("bt"); bt.onclick = function () { let txt = prompt("請輸入文字", "螞蟻部落"); odiv.innerHTML = txt; } } </script> </head> <body> <div id="ant"></div> <input type="button" value="點選檢視演示" id="bt" /> </body> </html>
上面程式碼實現了對prompt方法的演示效果,下面介紹一下實現過程。
(1).點選按鈕之後,觸發click事件。
(2).然後執行事件處理函式,執行到let txt = prompt("請輸入文字", "螞蟻部落"),那麼會彈出一個對話方塊。
截圖如下:
特別說明:在不同的瀏覽器,彈出框的外觀可能會有所不同。
方法中兩個引數的作用已經很明顯了。
如果感覺預設的內容不滿意,那麼我們可以填寫其他內容,比如"螞蟻一樣奮鬥"。
點選確定按鈕,那麼prompt方法的返回值就是輸入或者預設的文字內容。
如果點選取消按鈕,方法的返回值是null。
最後總結:
(1).彈出框可以輸入文字內容。
(2).點選確定,方法返回輸入的文字內容,點選取消返回null。
通常自帶的功能都是比較醜陋的,為了提高美觀度和靈活性,通常需要模擬實現。
關於更加漂亮的彈出框效果可以在特效下載版塊彈出層分類中查詢。
相關文章
- Prompt工程師指南[應用篇]:Prompt應用、ChatGPT|Midjouney Prompt Engineering工程師ChatGPT
- Prompt進階系列4:LangGPT(構建高效能Prompt實踐指南)--結構化PromptGPT
- MySQL prompt設定MySql
- 解密Prompt系列3. 凍結LM微調Prompt: Prefix-Tuning & Prompt-Tuning & P-Tuning解密
- MySQL修改提示符(prompt)MySql
- 解密Prompt系列2. 凍結Prompt微調LM: T5 & PET & LM-BFF解密
- 解密Prompt系列1. Tunning-Free Prompt:GPT2 & GPT3 & LAMA & AutoPrompt解密GPT
- Prompt進階2:LangGPT(構建高效能Prompt策略和技巧)--最佳實踐指南GPT
- running-a-command-prompt-as-nt-authoritysystem
- Sql Server必備外掛--SQL PromptSQLServer
- sqlplus之prompt_&&_&_new_valueSQL
- RAG實戰5-自定義prompt
- Chrome 對於 JavaScript 對話方塊的新策略 —— 建議不要使用 alert(), confirm(), 和 prompt()ChromeJavaScript
- 大模型提示工程之Prompt框架和示例大模型框架
- 【每週一讀】What is prompt-tuning?
- Prompt learning 教學[進階篇]:簡介Prompt框架並給出nlp技術:Few-Shot Prompting等框架
- anaconda prompt開啟失敗解決方法
- COGNOS #PROMPT與#PROMPTMANY的語法筆記筆記
- Oracle Display the process of the procedure ( oracle pipe , dbms_output , prompt )Oracle
- 在 Amazon Bedrock 上使用 Anthropic Claude 系統 Prompt
- 教你構建一個優秀的SD Prompt
- Prompt工程全攻略:15+Prompt框架一網打盡(BROKE、COAST、LangGPT)、學會提示詞讓大模型更高效框架ASTGPT大模型
- 在 Windows Git Bash 中安裝 bash-git-promptWindowsGit
- [20180927]修改sql prompt提示.txtSQL
- JS窗體彈出問題輸入答案_promptJS
- Prompt進階3:LangGPT(構建高效能質量Prompt策略和技巧2)--穩定高質量文案生成器GPT
- SQL Prompt教程:舊式聯接語法(ST001)SQL
- SQL語法提示工具SQL Prompt 釋出v10.6SQL
- 解密Prompt系列18. LLM Agent之只有智慧體的世界解密智慧體
- Midjourney|文心一格prompt教程[Text Prompt(上篇)]:品牌log、App、徽章、插畫、頭像場景生成,各種風格選擇:科技風、運動風APP
- PostgreSQL DBA(137) - PG 13(Allow invisible PROMPT2 in psql)SQL
- csh Prompt全描述--定製自己的linux命令列提示符Linux命令列
- 構建RAG應用-day02: prompt技巧總結 llamaIndex入門AIIndex
- 解密prompt系列25. RLHF改良方案之樣本標註:RLAIF & SALMON解密AI
- 【EMNLP 2023】面向Stable Diffusion的自動Prompt工程演算法BeautifulPrompt演算法
- 美化js系統函式alert,confirm,prompt,並實現lightbox效果JS函式
- 解密prompt系列26. 人類思考vs模型思考:抽象和發散思維解密模型抽象
- 解密prompt系列27. LLM對齊經驗之如何降低通用能力損失解密