Jquery deselect select drop-down box sample code

Jquery deselect select drop-down box sample code

This article mainly introduces the sample code of jquery's unselect select drop-down box. If you need it, you can refer to it and hope to help you.

There are three select drop-down boxes

Two classes are hidden in one category. When selecting a category, the category is displayed and the items selected by other classes are cleared.

This requirement is a bit ..........

 

The following are three select statements:

 

The Code is as follows:

<Select name = "pWaqqqy" id = "sel_type" onchange = "selectFunction ()">

<Option value = ""> all </option>

<Option value = "7"> aa </option>

<Option value = "8"> bb </option>

</Select>

<Select name = "pWay" id = "sel_children0" style = "display: none;">

<Option value = ""> all </option>

<Option value = "5"> a </option>

<Option value = "3"> a </option>

<Option value = "1"> a </option>

<Option value = "2"> a </option>

<Option value = "6"> a </option>

</Select>

<Select name = "pWay" id = "sel_children1" style = "display: none;">

<Option value = ""> all </option>

<Option value = "4"> B </option>

</Select>

 

Jquery extension. When calling, use $ ("select"). removeSelected ();

The Code is as follows:

JQuery. fn. removeSelected = function (){

This. val ("");

};

 

To select a Category Selection box, call the selectFunction () method:

The Code is as follows:

Function selectFunction (){

If ($ ("# sel_type"). val () = "7 "){

$ ("# Sel_children0"). show ();

$ ("# Sel_children1"). hide ();

$ ("# Sel_children1"). removeSelected ();

} Else if ($ ("# sel_type"). val () = "8 "){

$ ("# Sel_children1"). show ();

$ ("# Sel_children0"). hide ();

$ ("# Sel_children0"). removeSelected ();

} Else {

$ ("# Sel_children0"). hide (). removeSelected ();

$ ("# Sel_children1"). hide (). removeSelected ();

}

}

 

The premise is to first introduce the jquery. js File