Code Note: Registration page Verification Code

Source: Internet
Author: User

The article includes the following:

1. Verification code Making--Chinese | alphabet | numbers | ...

2, text verification code-image anti-theft chain (PHP, not JS)

3, JS prevent right click on the picture

4, Input form input box does not record the information entered

5. Css+div formatted page layout

1, Verification Code production

Reference: http://www.imooc.com/video/2458

Cond......

2, picture anti-theft chain

In the "for Example" TP framework, the member functions of the class can be accessed directly in the address bar, such as Http://localhost/Member/common/panduan

Here Panduan () is a method, written in class Commonaction extends mcommonaction{} classes commonaction controller inside,

member functions Public Function Panduan () {...} is written in the class controller commonaction, if you do not want to let the outside world directly access the method,

You can use the anti-theft chain technology, namely:

Public Function Panduan () {

if (!$_server[' Http_referer ']) {

echo "Access Error! ";

}

............

}

"Technical explanation" anti-theft chain technology uses HTTP Referer

3, JS prevent right click on the picture

Prevent right-click: the right mouse button click on the picture, the right-click menu does not pop up.

<script language= "JavaScript" >
/*document.oncontextmenu=youji;*///Add a right-click event for the current document to prevent the default right-click menu from Popping
function Youji ()
{
Alert ("Right click Success!") ");

return false;
}

Add a mouse right-click event for a DOM element
Window.onload = function () {
document.getElementById ("Div1"). Oncontextmenu=youji;
}
window.onload = function () {
document.getElementById ("vimg"). Oncontextmenu=youji;
document.getElementById ("Div1"). Oncontextmenu=youji;
}
/* may only perform one window.onload () */
</script>

<div id= "Div1" >
</div>

\\\\\\\\\\\\\\\window.onload () Introduction

The Windows.onload () call must wait until all the elements of the page that include the picture have been loaded before they can be executed.

Window.onload = Checkbox_click. Checkbox_click is a JS function.

Cannot write multiple at the same time, if there are multiple window.onload methods, only one will be executed

With the $ (document). Ready difference:

$ (document). Ready () is executed when the DOM structure is drawn and does not have to wait for the load to complete.

$ (document). Ready () can be written multiple at the same time and can be executed.
$ (document). Ready (function () {}) can be simply written as $ (function () {});

what is \\\\\\\\\\\\\ dom //////////

Reference: http://www.w3school.com.cn/htmldom/dom_nodes.asp

The DOM is the HTML element---the node, and all the HTML elements (nodes) can be modified, deleted, and so on.

Through the HTML DOM, all nodes in the tree can be accessed through JavaScript. All HTML elements (nodes) can be modified, or nodes can be created or deleted.

......

\\\\\\\\dom Concept Introduction End////////

PS: Introduction Click the small map to display the JS effect of large map

<title> Click to display the js</title> of the large image
<style>
#demo {overflow:hidden;width:120px;text-align:center;padding:10px;}
#demo img{border:3px solid #eeeeee; width:100px;height:75px;}
#enlarge_images {position:absolute;display:none;z-index:2;}
</style>
<div id= "Demo" ></div>
<div id= "Enlarge_images" ></div>
<script>
var demo = document.getElementById ("demo");
var GG = demo.getelementsbytagname ("img");
var ei = document.getElementById ("Enlarge_images");
for (i=0; i<gg.length; i++) {
var ts = gg[i];
Ts.onclick = function (event) {
Event = Event | | window.event;
Ei.style.display = "block";
ei.innerhtml = ' ';
Ei.style.top = Document.body.scrollTop + event.clienty + + "px";
Ei.style.left = document.body.scrollLeft + event.clientx + + "px";
}
Ts.onmouseout = function () {
ei.innerhtml = "";
Ei.style.display = "None";
}
}
</script>

4. Input form does not record information entered

When we enter the form information in the browser, often input text input box will record the information before submitting the form, each time just double-clicking the input text box will appear before the text entered, which sometimes feel more convenient, but sometimes also exposes the user's hidden data.

If you let the input form entry box not record the information you have entered, the method is as follows:

In fact, it is simple to add a autocomplete= "off" attribute to the input text entry box , and the relevant code is as follows:

<input type= "text" name= "uname" autocomplete= "off"/>

5, Css+div

The Style style property

Row Height: line-height

float: Float

Border: Border, for example: border:1px solid #ccc; /* Indicates that the border is a gray solid line roughness 1px*/

Rounded border: Border-radius, see www.kuqin.com/shuoit/20141014/342620.html

"HTML Tag"

Superscript:<sup></sup>

"Security Protection"

"Disable the page's right mouse button menu -View Source code"

$ (document). Ready (function () {

Add right-click event for DOM element: img id= "PV"
Window.onload =function () {//PV
document.getElementById ("PV"). Oncontextmenu=function () {return false;};
Window.oncontextmenu=function () {return false;}; Add "Disable viewing of source code" for all DOM elements (that is, the entire page)
}
});

"HTML page-how to Hide JS code"

In fact, JS code cannot be hidden, can only be confused or encrypted, or use other methods.

Idea one: confusing or encrypting
Strictly cannot be called encryption except that it is confusing to replace all variable names.

{Malpractice} scripting language confusion is just a poor readability. But the master will use Chrome or FF console to debug your JS. Therefore, security is relatively speaking.

Idea two: quote JS file

Referring to the JS page by reference method will not see the code, can be made into a JS file, and then call the JS connection.
In the JS file directory to do permission settings to prevent illegal access and download.

Format

<script type= "Text/javascript" src= "your js file. js" > </script>
In this way, the JS code is written in the JS file, it will not be seen in the HTML page.

--------------------------------------------------------------

Because the personal technical knowledge of the expression is not very professional, but also hope you crossing

A lot of apologies, more comments, more guidance!

(~_~)

First Write Date: 2016-6-14 11:30:13

Last Modified Date: 2016-6-16 16:18:35

2016-6-20 10:51:02

---------------------------------------------------------------

Code Note: Registration page Verification Code

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.