Share the code with everyone:
JavaScript code
/ /Get the number of select items
jQuery.fn.size = function()
{
return jQuery(this).get(0).options.length;
}
// Get the index of the selected item
jQuery.fn.getSelectedIndex = function()
{
return jQuery(this).get(0).selectedIndex;
}
//Get the currently selected item The text of
jQuery.fn.getSelectedText = function()
{
if(this.size() == 0)
{
return "No options in the drop-down box";
}
else
{
var index = this.getSelectedIndex();
return jQuery(this).get(0).options[index].text;
}
}
//Get the value of the currently selected item
jQuery.fn.getSelectedValue = function()
{
if(this.size() == 0)
{
return "There is no selected value in the drop-down box";
}
else
{
return jQuery(this).val();
}
}
//Setting select The item with value value is selected
jQuery.fn.setSelectedValue = function(value)
{
jQuery(this).get(0).value = value;
}
// Set the first item with text in select to be selected
jQuery.fn.setSelectedText = function(text)
{
var isExist = false;
var count = this.size();
for(var i=0;i{
if(jQuery(this).get(0).options[i].text == text)
{
jQuery(this).get(0).options[i].selected = true;
isExist = true;
break;
}
}
if(!isExist)
{
alert("This item does not exist in the drop-down box");
}
}
//Set the selected index item
jQuery.fn.setSelectedIndex = function(index)
{
var count = this.size();
if(index >= count || index < 0)
{
alert("The selected item index is out of range");
}
else
{
jQuery(this).get(0).selectedIndex = index;
}
}
//Judge whether there is a value in the select item. Item of value
jQuery.fn.isExistItem = function(value)
{
var isExist = false;
var count = this.size();
for(var i=0; i{
if(jQuery(this).get(0).options[i].value == value)
{
isExist = true;
break ;
}
}
return isExist;
}
//Add an item to the select, the display content is text and the value is value. If the item value already exists, it will prompt
jQuery.fn.addOption = function(text,value)
{
if(this.isExistItem(value))
{
alert("The value of the item to be added already exists");
}
else
{
jQuery(this).get(0).options.add(new Option(text,value));
}
}
/ /Delete the item with value in the select. If the item does not exist, prompt
jQuery.fn.removeItem = function(value)
{
if(this.isExistItem(value))
{
var count = this.size();
for(var i=0;i{
if(jQuery(this).get(0).options[ i].value == value)
{
jQuery(this).get(0).remove(i);
break;
}
}
}
else
{
alert("The item to be deleted does not exist!");
}
}
//Delete the item with the specified index in select
jQuery.fn.removeIndex = function(index)
{
var count = this.size();
if(index >= count || index < 0)
{
alert("Item to be deleted Index out of range");
}
else
{
jQuery(this).get(0).remove(index);
}
}
//Delete Selected items in select
jQuery.fn.removeSelected = function()
{
var index = this.getSelectedIndex();
this.removeIndex(index);
}
//Clear all items in the select
jQuery.fn.clearAll = function()
{
jQuery(this).get(0).options.length = 0;
}
When using it, first import the jquery.js file, then import the jquery.liu.select.js file, and then call the plug-in method. For example, if I want to clear all the items in the drop-down box with the ID selEmail, then I can do this: $("#selEmail").clearAll();
Note: The method in this plug-in is available in ie7 and firefox The verification has been passed. If there are any errors or areas that need improvement, I hope you will criticize and correct them.