-Moz-user-select and onselectstart prohibit Text Selection

Source: Internet
Author: User

[Transfer]
Today, I accidentally noticed that the password input boxes of QQ and HI cannot be deleted once with the mouse selected. I can only delete them one by one. Then I want to know how to achieve this effect in Js.
There are still a lot of Internet users, but I have tested a lot and found that it is not perfect. the browser is still playing a strange role. One method seems to only satisfy one browser.

Onselectstart = "Return false;", can meet the effect of IE. When it is only for a region, the statement of this segment is placed in a region. For example, <Div onselectstart = "Return false;"> ********* </div>, set onselectstart = "Return false;" directly in the body or use: document. onselectstart = function () {return false ;}

Style = "-moz-user-select: none;", can meet the effect in Firefox, because onselectstart = "Return false;" cannot produce the expected effect in Firefox, it can only be implemented in CSS mode. Of course, as before, when the entire document needs to achieve this effect, set the body style to-moz-user-select: none ;.

Finally, I have to talk about Google's Chrome browser. When the two methods are used in input, they cannot achieve the effect that the mouse cannot choose. So far, I have not found a good solution.

This is a test code compatible with most browsers:

<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<HTML xmlns = "http://www.w3.org/1999/xhtml">

<Head>

<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"/>

<Title> test </title>

</Head>

<Body>

<Div onselectstart = "Return false;" style = "-moz-user-select: none;"> you cannot select me </div>

</Body>

</Html>

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.