Android CSS Set select height bug resolution and JQ action Select

Using CSS to set the height and line-height of select is invalid in some versions of Android, but can be added by adding "-webkit-appearance:listbox;" property to resolve the bug, the full instance code is as follows:

. styled-select {
-webkit-appearance:listbox;
width:100%;
font-size:36px;
display:inline-block;< c4/> height:80px;
line-height:80px;
Text-align:center;
Background: #8f7a66;
margin-top:40px;
Color: #f9f6f2;
border-radius:3px;
Text-decoration:none;
}

jquery operation Select (value, set selected)


Every time you work on a SELECT, you always have to come out and flip the data, so you can summarize it, and then turn here.

such as <select class= "selector" ></select>

1, set value to Pxx item selected

$ (". Selector"). Val (" Pxx ");

2, setting text to Pxx selects

$ (". Selector"). Find ("option[text= ' Pxx ')"). attr ("selected", true);

Here is a use of brackets, preceded by an equal sign in brackets, without quotation marks. In many cases, the use of brackets can make logic simple.

3, gets the value

$ (". Selector") of the currently selected item. val ();

4, gets the text

$ (". Selector") of the currently selected item. Find ("option:selected"). Text ()

A colon is used here, and mastering its usage and extrapolate also makes the code concise.

often uses a cascade of SELECT, that is, the value of the second select changes with the value selected by the first select. This is very simple in jquery.

such as:

$ (". Selector1"). Change (function () {
//Empty the second
$ (". Selector2") first. empty ();
In practical applications, the option here is generally to generate multiple
var option = $ ("<option>") with Loops. val (1). Text ("Pxx");
$ (". Selector2"). Append (option);