Home  >  Article  >  Web Front-end  >  How to call confirm return value in javascript

How to call confirm return value in javascript

PHPz
PHPzOriginal
2023-05-17 14:56:091232browse

JavaScript is a widely used programming language that can be used for both front-end and back-end development. Among them, the confirm pop-up window is a common interaction method. In the confirmation dialog box, the user can choose two options: "OK" or "Cancel". However, in actual development, we often need to perform different operations after the user selects. So, how to call confirm to return the value? This article will introduce it to you in detail.

1. Confirmation dialog box

In JavaScript, the confirm() method is used to create a confirmation dialog box. Its syntax is as follows:

confirm(msg)

Among them, msg is a string type parameter that represents the message to be displayed in the confirmation dialog box. This method returns a Boolean value indicating whether the user selected "OK" or "Cancel":

确认:true
取消:false

For example, the following code will create a confirmation dialog box asking the user whether to submit the form:

var result = confirm("是否提交表单?");
if(result){
   // 用户选择了“确定”
}else{
   // 用户选择了“取消”
}

2. Return value of calling confirm

In actual development, we usually need to perform different operations based on the user's selection. Therefore, when calling the confirm method, we need to store the user's selection into a variable and perform different operations based on the value of the variable.

The following is a simple example. When the user selects "OK", the page will jump to the Baidu homepage; when the user selects "Cancel", the page will display a prompt box:

var result = confirm("确认要跳转到百度首页吗?");
if(result){
   window.location.href = "https://www.baidu.com";
}else{
   alert("已取消跳转。");
}

In the above code, we use the window.location.href attribute to implement page jump and the alert method to create a prompt box.

3. Use function to encapsulate confirm

In the above example, we used the if statement to judge the user's choice and perform different operations. However, if there are multiple confirmation dialog boxes that need to use this judgment logic, the code duplication will be relatively high, which is not conducive to maintenance. Therefore, we can encapsulate a function to handle the user's selection, and the code will become clearer and more concise.

The following is an example. We create a function named showConfirm, which receives two parameters, one is the message to be displayed, and the other is the callback function to be executed when the user clicks "OK":

function showConfirm(msg,callback) {
   var result = confirm(msg);
   if(result){
      callback();
   }
}

In the above code, we use a callback function to implement the click event of the "OK" button. When the user selects "OK", the callback function will be called to perform the corresponding operation.

The following is an example of how to use the showConfirm function. When the user clicks the button, a confirmation dialog box will pop up asking if they want to jump to the Baidu homepage. When the user selects "OK", the page will jump to the Baidu homepage; when the user selects "Cancel", no operation will occur:

<button onclick="showConfirm('是否跳转到百度首页?', function() {window.location.href='https://www.baidu.com'})">跳转到百度</button>

In the above code, we use the showConfirm function to encapsulate The confirmation dialog box pops up and the user selection is processed. Due to the characteristics of the callback function, we can customize a function for the operation performed when the user selects "OK", which enhances the scalability and maintainability of the code.

Summary

In JavaScript, calling confirm to return a value is a common programming skill and an essential knowledge point in development. This article briefly introduces how to create a confirmation dialog box through the confirm method, and how to perform different operations based on the return value selected by the user. At the same time, we also introduced how to use functions to encapsulate confirm to improve the readability and maintainability of the code in actual development.

The above is the detailed content of How to call confirm return value in javascript. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn