The following describes the ajax debugging steps under jquery through a combination of graphics and text.
During the use of ajax,The most comfortable is one step success,The biggest headache is unsuccess.But I don't know where to look for the error,Then see what went wrong after the error,So today about the use of ajax debugging:
Let me tell you about the project requirements:tools/raw materials, jquery.js, editor, chrome browser, wamp build environment
Specific implementation methods and steps please see below:
Step 1:Create ajax.html and ajax.php in the same directory
The second step:write ajax.html, pay attention to modify the file encoding to utf-8, the code is as follows:
<! Doctype html> <html> <head> <title>ajax</title> </head> <body> <button onclick="checkajax ()">ajax test</button> </body> </html> </pre> </div> <p> Under the wamp environment, the browser runs as shown in the figure: </p> <p> The third step:write the ajax.php file, pay attention to modify the file encoding to UTF-8, the code is as follows: </p> <div> <pre> <?php echo "ajax test";
Under the wamp environment, use the browser to run as shown in the figure:
Step 4:Add the following code to the head of ajax.html:
The current ajax.html code structure is shown in the figure:
Step 5:In the wamp environment, run ajax.html, click the ajax test button, and a popup box as shown in the figure will appear.Description is normal;If there is no result,Refer to the troubleshooting methods below.
Step 6:See here,It means you have an error,After that, let's talk about the troubleshooting method:
First, right-click in the blank space of the browser->review element,Then see if there is a red "x" as shown in Figure 2. If there is a syntax error in js,Click on the red "x", it will locate to 2, which is the name of the error file,After clicking, it will locate to 3, which is the place where the grammatical error occurs or there is an error in front of this positionIf not,Reference 7
Step 7:Similarly on the basis of Step 6,Look at the information in network->ajax.php->headers on the right,If it is 200 ok, there is no problem with the file path.For other values,Then determine the calling path of the php file;Even if it is 200 ok, check the content under the preview option,This content is the output of the php file:Take ajax.php as an example, the php file outputs ajax test, and the preview shows ajax test. If the preview output is other content as shown in Figure 3, there is an error in the php file.
Step 8:So much is said aboveBut there are many different types of errors,We cannot list them one by one.But to summarize the idea:an error has occurred,First, determine whether the error is two files, html and php.Which file went wrong,Then go to the corresponding file to resolve.
The code in step 4 can be abbreviated:
The main difference is the use of $.ajax and $.post,$.post is simpler to use,But $.ajax is more conducive to comprehensive understanding.
- python - you may need to restart the kernel to use updated packages error
- php - coincheck api authentication doesn't work
- php - i would like to introduce the coincheck api so that i can make payments with bitcoin on my ec site
- [php] i want to get account information using coincheck api
- the emulator process for avd pixel_2_api_29 was killed occurred when the android studio emulator was started, so i would like to
- python 3x - typeerror: 'method' object is not subscriptable
- i want to call a child component method from a parent in vuejs
- xcode - pod install [!] no `podfile 'found in the project directory
- sh - 'apt-get' is not recognized as an internal or external command, operable program or batch file