Analysis on the reasons why document. getelementbyid cannot obtain the value

Source: Internet
Author: User

Modify the paging class a few days ago. to jump to a specified page, you can directly enter the page number and click the button to jump to the specified page number!

When you look at this requirement, you can think of using get to pass the value, but the conventional get method needs to write the link into the href of the tag, and we actually want to click with a button, instead of a simple hyperlink. So Javascript is used to write code under the onclick event of the button. It is clear that the value of input (the page number of the user input) is uploaded to the onclick code. Here, the Javascript location is used to complete the jump.

Well, this is what it looks like. I won't say much about the getelementbyid method. Focus on the problems I encountered and how to solve them.

1. Javascript itself will not report errors. As long as you do not get the expected results, the code will certainly be faulty.At this time, you can look at the symbols in the Code, such as single quotes, double quotation marks, braces, Parentheses, and so on... because this code is not directly written in the JS file, it is constructed in PHP for output. In addition, the PHP output requires single quotation marks and double quotation marks, therefore, it is easy to make mistakes when many symbols are mixed together. It doesn't matter. You can run it first, and then check the source code of the webpage to see if the current Javascript is the one you need. We will immediately add it to the list if any symbols are missing, however, you need to note that if you want to directly output single quotes and double quotes, escape them using '\' in PHP code.

The above problem generally does not bring up any results, even if we use alert to view the set variables, it cannot be executed because of JavaScript code problems! Assuming that you have corrected the syntax error, we can continue to look at... we can use the following code to get the page number entered by the user and print the output to see if it is correct or not.

 
 
  1. var uPage=document.getElementById('pa').value; 
  2. alert(uPage); 

2. If the "undefined" prompt pops up at this time, it should at least indicate that your JavaScript code is running correctly and there is no syntax error!As for the reason for undefined, I did not find the cause after debugging for a long time. Later, I accidentally tried to change the value to innerhtml and printed some results, however, after a closer look, we can see that the content in the DIV with the same ID is printed, and then we suddenly realized that... in the paging class, the ID of the input tag is called page, and this page is also used in other Divs. Therefore, the input ID in the paging class is changed to a very abnormal name. In fact, we should pay attention to these issues at this time. If our code may be provided to others, it is very important to name it, if it is internal (for example, the input label is only used in the class), the name should be as complex as possible, in this way, it is unlikely that it conflicts with the user's name.

Finally:

 
 
  1. Document. getelementbyid ('idname'). value; // obtain the value in the input tag, value;
  2. Document. getelementbyid ('idname'). innerhtml; // obtain the HTML content in the DIV
  3. In another way, the value is. // value = Document. getelementbyid ("**"). value; value = Document. getelementsbyname ("**) [0]. value;

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.