Home  >  Article  >  Web Front-end  >  Jquery operation Select is simple and convenient. A js plug-in can handle it_jquery

Jquery operation Select is simple and convenient. A js plug-in can handle it_jquery

WBOY
WBOYOriginal
2016-05-16 18:41:47897browse

Here is the js code:

Copy code The code is as follows:

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 text of the currently selected item
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 "No selected value in the drop-down box";
}
else
{
return jQuery(this).val();
}
}
//Set the item with value in select to be 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("The 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;
}
}
//Determine whether there is an item with value in the select item
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 value of the item 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 select, if the item does not exist, Then the 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 is not Exists!");
}
}
//Delete the item with the specified index in select
jQuery.fn.removeIndex = function(index)
{
var count = this. size();
if(index >= count || index < 0)
{
alert("The index of the item to be deleted is out of range");
}
else
{
jQuery(this).get(0).remove(index);
}
}
//Remove the selected item in select
jQuery.fn.removeSelected = function ()
{
var index = this.getSelectedIndex();
this.removeIndex(index);
}
//Clear all items in select
jQuery.fn. clearAll = function()
{
jQuery(this).get(0).options.length = 0;
}

It is very simple to use, first introduce the main Jquery .js
Then import this js file, and then you can use these methods
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn