suchen

Heim  >  Artikel  >  Web-Frontend  >  Beispielcode für JavaScript-Operationen für ausgewählte Elemente und Optionen_Javascript-Fähigkeiten

Beispielcode für JavaScript-Operationen für ausgewählte Elemente und Optionen_Javascript-Fähigkeiten

WBOY
WBOYOriginal
2016-05-16 15:16:461012Durchsuche

Ohne weitere Umschweife werde ich den Code direkt für Sie veröffentlichen. Der spezifische Code lautet wie folgt: 

<!DOCTYPE html PUBLIC "-//WC//DTD XHTML . Transitional//EN" "http://www.w.org/TR/xhtml/DTD/xhtml-transitional.dtd">
<html xmlns="http://www.w.org//xhtml">
<head>
<title></title>
<!--添加jquery-->
<script src="../Script/jQuery/jquery-...min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
createSelect("select", "addSel");
addOption("addSel", "first", "第一个数据");
addOption("addSel", "secord", "第二个数据");
addOption("addSel", "three", "第三个数据");
addOption("addSel", "four", "第四个数据");
addOption("addSel", "fives", "第五个数据");
removeOneByIndex("addSel", );
removeOneByObj("addSel", "secord");
//添加一个option更改事件 调用自己写的方法
$("#addSel").change(function () {
alert("旧文本："+getOptionText("addSel") + "旧Value：" + getOptionValue("addSel"));
editOptions("addSel", "新文本","新Value"); //注意：不传value值的时候 value值默认为text的值
alert("新文本：" + getOptionText("addSel") + "新Value：" + getOptionValue("addSel"));
})
})
//动态创建带id的元素
function createSelect(element, id) {
var select = document.createElement(element);
select.id = id;
document.body.appendChild(select);
}
//根据select的id 添加选项option
function addOption(selectID,value,text) {
//根据id查找对象， 
var obj = document.getElementById(selectID); 
obj.options.add(new Option(text, value)); //这个兼容IE与firefox 
}
//删除所有选项option
function removeAll(selectID) {
var obj = document.getElementById(selectID);
obj.options.length = ;
}
//根据 index 值删除一个选项option
function removeOneByIndex(selectID,index) {
var obj = document.getElementById(selectID);
//index,要删除选项的序号，这里取当前选中选项的序号 
//var index = obj.selectedIndex;//获取选中的选项的index;
obj.options.remove(index);
}
//根据 value或者text值删除一个选项option
function removeOneByObj(selectID, textOrValue) {
var obj = document.getElementById(selectID);
//index,要删除选项的序号，这里取当前选中选项的序号 
//var index = obj.selectedIndex;//获取选中的选项的index;
for (var i = ; i < obj.options.length; i++) {
if (obj.options[i].innerHTML == textOrValue || obj.options[i].value == textOrValue) {
obj.options.remove(i);
break;
}
}
} 
//获得一个Option Value；
function getOptionValue(selectID){
var obj = document.getElementById(selectID); 
var index=obj.selectedIndex; //序号，取当前选中选项的序号 
var val = obj.options[index].value;
return val;
} 
//获得一个option Text;
function getOptionText(selectID) {
var obj = document.getElementById(selectID); 
var index=obj.selectedIndex; //序号，取当前选中选项的序号 
var val = obj.options[index].text;
return val;
}
//修改选中的option
function editOptions(selectID,newText,newValue) {
var obj = document.getElementById(selectID); 
var index=obj.selectedIndex; //序号，取当前选中选项的序号 
obj.options[index] = new Option(newText, newValue);
obj.options[index].selected = true;
}
//删除select
function removeSelect(){
var select = document.getElementById("select"); 
select.parentNode.removeChild(select); 
}
</script>
</head>
<body>
</body>
</html>

Das Obige ist der Beispielcode, den der Editor mit Ihnen geteilt hat, um das ausgewählte Element und die Option in JavaScript zu bedienen. Ich hoffe, dass er für Sie hilfreich ist.

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Analyse des Unterschieds zwischen verschachtelten Javascript-Funktionen und dem Aufruf externer Funktionen innerhalb von Funktionen_Javascript-FähigkeitenNächster Artikel：Analyse des Unterschieds zwischen verschachtelten Javascript-Funktionen und dem Aufruf externer Funktionen innerhalb von Funktionen_Javascript-Fähigkeiten

In Verbindung stehende Artikel

Mehr sehen