{"id":673,"date":"2024-01-05T18:53:00","date_gmt":"2024-01-05T18:53:00","guid":{"rendered":"https:\/\/www.cmsgalaxy.com\/blog\/?p=673"},"modified":"2024-02-05T10:27:49","modified_gmt":"2024-02-05T10:27:49","slug":"javascript-pop-up-boxes","status":"publish","type":"post","link":"https:\/\/www.cmsgalaxy.com\/blog\/javascript-pop-up-boxes\/","title":{"rendered":"JavaScript Pop-up Boxes"},"content":{"rendered":"\n<p>In JavaScript, you can create popup boxes to interact with users using the <code>alert()<\/code>, <code>confirm()<\/code>, and <code>prompt()<\/code> functions. These functions provide simple ways to display messages, ask for user confirmation, and prompt the user for input.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">1. Alert Box (<code>alert()<\/code>):<\/h3>\n\n\n\n<p>The <code>alert()<\/code> function displays a message to the user in a dialog box with an &#8220;OK&#8221; button.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>alert(\"Hello, world!\");<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">2. Confirm Box (<code>confirm()<\/code>):<\/h3>\n\n\n\n<p>The <code>confirm()<\/code> function displays a message to the user in a dialog box with &#8220;OK&#8221; and &#8220;Cancel&#8221; buttons. It returns <code>true<\/code> if the user clicks &#8220;OK&#8221; and <code>false<\/code> if the user clicks &#8220;Cancel&#8221;.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>let result = confirm(\"Are you sure you want to proceed?\");\nif (result) {\n  console.log(\"User clicked OK\");\n} else {\n  console.log(\"User clicked Cancel\");\n}<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">3. Prompt Box (<code>prompt()<\/code>):<\/h3>\n\n\n\n<p>The <code>prompt()<\/code> function displays a dialog box that prompts the user for input. It returns the text entered by the user, or <code>null<\/code> if the user clicks &#8220;Cancel&#8221;.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>let name = prompt(\"What is your name?\");\nif (name !== null) {\n  console.log(\"Hello, \" + name + \"!\");\n} else {\n  console.log(\"User clicked Cancel\");\n}<\/code><\/pre>\n\n\n\n<p>These popup boxes can be useful for displaying messages, confirming user actions, and gathering input from the user in a simple and straightforward manner. However, they can also be intrusive and should be used judiciously to provide a better user experience.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In JavaScript, you can create popup boxes to interact with users using the alert(), confirm(), and prompt() functions. These functions<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-673","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/www.cmsgalaxy.com\/blog\/wp-json\/wp\/v2\/posts\/673","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.cmsgalaxy.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.cmsgalaxy.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.cmsgalaxy.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/www.cmsgalaxy.com\/blog\/wp-json\/wp\/v2\/comments?post=673"}],"version-history":[{"count":1,"href":"https:\/\/www.cmsgalaxy.com\/blog\/wp-json\/wp\/v2\/posts\/673\/revisions"}],"predecessor-version":[{"id":674,"href":"https:\/\/www.cmsgalaxy.com\/blog\/wp-json\/wp\/v2\/posts\/673\/revisions\/674"}],"wp:attachment":[{"href":"https:\/\/www.cmsgalaxy.com\/blog\/wp-json\/wp\/v2\/media?parent=673"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.cmsgalaxy.com\/blog\/wp-json\/wp\/v2\/categories?post=673"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.cmsgalaxy.com\/blog\/wp-json\/wp\/v2\/tags?post=673"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}