Talk about JavaScript Custom callback functions _javascript Tips

No more nonsense to say, directly to everyone paste code.

Background analysis

First look at a paragraph of JS code, the main implementation of the time to add the first through the asynchronous request to determine whether there is, if it does not exist, in the add operation:

function Add (url,data) {
 var isexited = isexited (data); 
 if (!isexited) {
  addrequest (URL, data); 
 }
}

When I add a data, I first of all by judging whether there is in the database (of course, if the front and back of the complete separation, should not be the front-end business logic to judge, the front-end should only be used to show data), first of all, isexited () request is the AJAX request implementation, this is asynchronous, it is clear, The interface is likely to perform the following function (usually Yes) when the result is not returned, so that the value of isexited is undefined, which is clearly not desired, and if a similar function can be implemented using a callback function, a case is described below.

Process is as follows

The foreground JSP interface is as follows:

<%@ page language= "java" contenttype= "text/html; Charset=utf-8 "pageencoding=" UTF-8 "%> <%@ taglib prefix=" C "uri=" Http://java.sun.com/jsp/jstl/core "%> < head> <meta charset= "Utf-8" > <meta http-equiv= "x-ua-compatible" content= "Ie=edge" > <meta name= " Viewport "content=" Width=device-width, initial-scale=1 "> <title>js callback function Case </title> <!--Bootstrap-- > <link href= "<c:url value= '/lib/bootstrap/css/bootstrap.min.css '/>" rel= "stylesheet" > <script Type= "Text/javascript" >/** * Delete request/function Supplierdelete (element) {var id = Element.parentNode.par
   entnode.cells[0].innerhtml;
  Modaldeleterequest (' ${pagecontext.request.contextpath}/oms/supplier/remove/', id); </script>  

The main JS code is as follows:

<script type= "Text/javascript" >

  /**
   * Delete request
  /function Supplierdelete (element) {
   var id = element.parentnode.parentnode.cells[0].innerhtml;
   Modaldeleterequest (' ${pagecontext.request.contextpath}/oms/supplier/remove/', id);
  }
 </script>

This is where you delete the button when you click it. But I want to pop up a confirmation delete dialog box, if after the selection is confirmed, then call the specific Delete method, and here is a reference to a modal box (bootstrap frame), mainly for display pop-up information, the code is as follows:

Below

is today's lead:

/** * Delete requested action * @param URL Delete request URL * @param ID/function modaldeleterequest (URL, id) {confirmisdelete (URL,
ID, deleterequest); /** * Call callback function * @param URL * @param id/function deleterequest (URL, id) {$.get (url + ID, function (res)
  Ult) {$ ("#modal-add-result-text"). Text (result.msg);
 $ ("#modal-result"). Modal (' show ');
}, "JSON"); /** * Pop-up dialog to confirm whether to delete * @param url delete request URL * @param ID delete Request ID * @param callback callback function, the function that needs to be callback at the last time. Firmisdelete (URL, id, callback) {var Confirmdeletedialog = $ (' <div class= ' modal fade ' ><div class= ' Modal-dialog "> ' + ' <div class=" modal-content "><div class=" Modal-header "><button" button "type=" close "' + ' data-dismiss= ' modal ' aria-hidden= ' true ' >x</button> ' + ' 
 

Above because the code is more, look at a simple frame below:

/**
 * Callback function test Method
 * * 
 @param callback
 * Callback method/
function Testcallback (callback) {
 alert (' Come in! ');
 Callback ();
}

/**
 * The function called the callback functions */function
A () {
 alert (' a ');
}

/**
 * Start test method
 /
function Start () {
 testcallback (a);
}

The above content is small series through the Code analysis to introduce the JS callback function, I hope you like.