1. สร้างการเลือกแบบไดนามิก
คัดลอกรหัสรหัสดังต่อไปนี้:
ฟังก์ชั่น createSelect(){
var mySelect = document.createElement_x("เลือก");
mySelect.id = "mySelect";
document.body.appendChild(mySelect);
-
2. เพิ่มตัวเลือกตัวเลือก
คัดลอกรหัสรหัสดังต่อไปนี้:
ฟังก์ชั่น addOption(){
// ค้นหาวัตถุตามรหัส
var obj=document.getElementByIdx_x('mySelect');
//เพิ่มตัวเลือก
obj.add(ตัวเลือกใหม่("ข้อความ", "ค่า")); //ใช้ได้เฉพาะใน IE เท่านั้น
obj.options.add(ตัวเลือกใหม่("ข้อความ", "ค่า")); // สิ่งนี้เข้ากันได้กับ IE และ firefox
-
3. ลบตัวเลือกตัวเลือกทั้งหมด
คัดลอกรหัสรหัสดังต่อไปนี้:
ฟังก์ชั่นremoveAll(){
var obj=document.getElementByIdx_x('mySelect');
obj.options.ความยาว=0;
-
4. ลบตัวเลือกตัวเลือก
คัดลอกรหัสรหัสดังต่อไปนี้:
ฟังก์ชั่น RemoveOne(){
var obj=document.getElementByIdx_x('mySelect');
//ดัชนี หมายเลขซีเรียลของตัวเลือกที่จะลบ ที่นี่จะใช้หมายเลขซีเรียลของตัวเลือกที่เลือกในปัจจุบัน
ดัชนี var=obj.selectedIndex;
obj.options.remove(ดัชนี);
-
5. รับมูลค่าของตัวเลือกออปชั่น
var obj=document.getElementByIdx_x('mySelect');
var index=obj.selectedIndex; //หมายเลขซีเรียล ใช้หมายเลขซีเรียลของตัวเลือกที่เลือกในปัจจุบัน
var val = obj.options [ดัชนี] .value;
6. รับข้อความของตัวเลือกตัวเลือก
var obj=document.getElementByIdx_x('mySelect');
var index=obj.selectedIndex; //หมายเลขซีเรียล ใช้หมายเลขซีเรียลของตัวเลือกที่เลือกในปัจจุบัน
var val = obj.options[ดัชนี].ข้อความ;
7. แก้ไขตัวเลือกตัวเลือก
var obj=document.getElementByIdx_x('mySelect');
var index=obj.selectedIndex; //หมายเลขซีเรียล ใช้หมายเลขซีเรียลของตัวเลือกที่เลือกในปัจจุบัน
var val = obj.options[ดัชนี]=ตัวเลือกใหม่("ข้อความใหม่", "ค่าใหม่");
8.ลบการเลือก
คัดลอกรหัสรหัสดังต่อไปนี้:
ฟังก์ชั่น RemoveSelect(){
var mySelect = document.getElementByIdx_x("mySelect");
mySelect.parentNode.removeChild (mySelect);
-
รหัสที่สมบูรณ์สำหรับตัวอย่างทั้งหมดมีดังนี้:
คัดลอกรหัสรหัสดังต่อไปนี้:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//ZH-CN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<หัว>
<meta http-equiv="ประเภทเนื้อหา" content="text/html">
<หัว>
<ภาษาสคริปต์=จาวาสคริปต์>
ฟังก์ชั่น $(id)
-
ส่งคืน document.getElementByIdx_x(id)
-
ฟังก์ชั่นแสดง()
-
var selectObj=$("พื้นที่")
var myOption=document.createElement_x("ตัวเลือก")
myOption.setAttribute("ค่า", "10")
myOption.appendChild(document.createTextNode("เซี่ยงไฮ้"))
var myOption1=document.createElement_x("ตัวเลือก")
myOption1.setAttribute("ค่า", "100")
myOption1.appendChild(document.createTextNode("หนานจิง"))
selectObj.appendChild (ตัวเลือกของฉัน)
selectObj.appendChild(myOption1)
-
ตัวเลือกฟังก์ชัน()
-
var index=$("พื้นที่").selectedIndex;
var val=$("พื้นที่").ตัวเลือก[ดัชนี].getAttribute("มูลค่า")
ถ้า(val==10)
-
var i=$("บริบท").childNodes.length-1;
var remobj=$("บริบท").childNodes[i];
remobj.removeNode (จริง)
var sh=document.createElement_x("เลือก")
sh.add(ตัวเลือกใหม่("เขตผู่ตงใหม่", "101"))
sh.add(ตัวเลือกใหม่("เขตหวงผู่", "102"))
sh.add(ตัวเลือกใหม่("เขตซูฮุย", "103"))
sh.add(ตัวเลือกใหม่("เขตผู่โถว", "104"))
$("บริบท").appendChild(sh)
-
ถ้า(val==100)
-
var i=$("บริบท").childNodes.length-1;
var remobj=$("บริบท").childNodes[i];
remobj.removeNode (จริง)
var nj=document.createElement_x("เลือก")
nj.add(ตัวเลือกใหม่("เขตซวนหวู่", "201"))
nj.add(ตัวเลือกใหม่("白下区", "202"))
nj.add(ตัวเลือกใหม่("เขตเซียกวน", "203"))
nj.add(ตัวเลือกใหม่("เขต Qixia","204"))
$("บริบท").appendChild(nj)
-
-
ฟังก์ชั่นการคำนวณ()
-
var x=$("บริบท").childNodes.length-1;
การแจ้งเตือน(x)
-
ฟังก์ชั่นลบ()
-
var i=$("บริบท").childNodes.length-1;
var remobj=$("บริบท").childNodes[i];
remobj.removeNode (จริง)
-
</สคริปต์>
<ร่างกาย>
<div id="บริบท">
<select id="area" onchange="choice()">
</เลือก>
</div>
<input type=button value="Show" onclick="show()">
<input type=button value="โหนดการคำนวณ" onclick="calc()">
<input type=button value="ลบ" onclick="remove()">
</ร่างกาย>
</html>
เวอร์ชันที่ได้รับการปรับปรุง: เพิ่ม แก้ไข และลบองค์ประกอบตัวเลือกในส่วนที่เลือก
คัดลอกรหัสรหัสดังต่อไปนี้:
ฟังก์ชั่น watch_ini(){ // เริ่มต้น
สำหรับ (var i=0; i<arguments.length; i++){
var word = document.createElement_x("ตัวเลือก");
word.text = ข้อโต้แย้ง [i];
watch.keywords.add(word); // watch เป็นชื่อฟอร์ม
-
-
ฟังก์ชั่น watch_add(f){/ // เพิ่ม
var word = document.createElement_x("ตัวเลือก");
word.text = f.word.value;
f.keywords.add(คำ);
-
อย่างไรก็ตาม วิธีการเพิ่ม () ข้างต้นใช้ได้เฉพาะกับ IE เท่านั้น เพื่อให้เข้ากันได้กับ FF และ Opera โค้ดด้านบนได้รับการปรับปรุงดังนี้:
คัดลอกรหัสรหัสดังต่อไปนี้:
ฟังก์ชั่น watch_ini(){ // เริ่มต้น
สำหรับ (var i=0; i<arguments.length; i++){
var oOption=ตัวเลือกใหม่(อาร์กิวเมนต์[i],อาร์กิวเมนต์[i]);
document.getElementByIdx_x("MySelect")[i]=oOption;
-
-
ฟังก์ชั่น watch_add(f){/ // เพิ่ม
var oOption=ตัวเลือกใหม่(f.word.value,f.word.value);
f.keywords[f.keywords.length]=oตัวเลือก;
-
รหัสที่สมบูรณ์สำหรับตัวอย่างทั้งหมดมีดังนี้:
คัดลอกรหัสรหัสดังต่อไปนี้:
<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<หัว>
<title>javascript เลือกตัวเลือกค่าข้อความ</title>
<meta name="keywords" content="javascript เลือกตัวเลือก ค่าข้อความ เพิ่ม แก้ไข ลบ ชุด">
<meta name="description" content="javascript เลือกตัวเลือก ค่าข้อความ เพิ่ม แก้ไข ลบ ชุด">
<ภาษาสคริปต์ = "จาวาสคริปต์">
-
ฟังก์ชั่น watch_ini(){ // เริ่มต้น
สำหรับ (var i=0; i<arguments.length; i++){
var oOption=ตัวเลือกใหม่(อาร์กิวเมนต์[i],อาร์กิวเมนต์[i]);
document.getElementByIdx_x("MySelect")[i]=oOption;
-
-
ฟังก์ชั่น watch_add(f){/ // เพิ่ม
var oOption=ตัวเลือกใหม่(f.word.value,f.word.value);
f.keywords[f.keywords.length]=oตัวเลือก;
-
ฟังก์ชั่น watch_sel(f){/ // แก้ไข
f.word.value = f.keywords[f.keywords.selectedIndex].ข้อความ;
-
ฟังก์ชั่น watch_mod(f){/ // แก้ไข
f.keywords[f.keywords.selectedIndex].text = f.word.value;
-
ฟังก์ชั่น watch_del(f){/ // ลบ
f.keywords.remove(f.keywords.selectedIndex);
-
ฟังก์ชั่น watch_set(f){/ // บันทึก
ชุด var = "";
สำหรับ(var i=0; i<f.keywords.length; i++){
ตั้งค่า += f.keywords[i].text + ";";
-
ยืนยัน(ตั้งค่า);
-
-
</สคริปต์>
</หัว>
<ร่างกาย>
<ชื่อแบบฟอร์ม = "นาฬิกา" วิธีการ = "โพสต์" การกระทำ = "">
<select id="MySelect" name="keywords" size="10" onchange="watch_sel(this.form)"></select><br>
<ภาษาสคริปต์ = "จาวาสคริปต์">
-
watch_ini("ฉัน", "คุณ", "เขา", "เธอ", "มัน", "เอ่อ"); // คำหลักเริ่มต้น
-
</สคริปต์>
<input type="text" name="word" /><br />
<input type="button" value="Add" onclick="watch_add(this.form); />
<input type="button" value="Modify" onclick="watch_mod(this.form);" />
<input type="button" value="Delete" onclick="watch_del(this.form);" />
<input type="button" value="Save" onclick="watch_set(this.form); />
</แบบฟอร์ม>
สร้างวิธีการอาร์เรย์จากสตริง:
คัดลอกรหัสรหัสดังต่อไปนี้:
<ภาษาสคริปต์ = "จาวาสคริปต์">
</ร่างกาย>
</html>
<สคริปต์>
ฟังก์ชั่น spli(){
ข้อมูลstr = "2,2,3,5,6,6";
var str= อาร์เรย์ใหม่ ();
str=datastr.split(",");
สำหรับ (i=0;i<str.length ;i++)
{ document.write(str[i]+"<br/>"); }
-
แยก();
</สคริปต์>
วันนี้ฉันแก้ไขจุดบกพร่องของ js และทำงานได้ดีบน IE อย่างไรก็ตาม เกิดข้อผิดพลาดขณะทำการดีบักบน Firefox
obj.add(ตัวเลือกใหม่("ข้อความ", "ค่า")); //ใช้ได้เฉพาะใน IE เท่านั้น
obj.options.add(ตัวเลือกใหม่("ข้อความ", "ค่า")); // สิ่งนี้เข้ากันได้กับ IE และ firefox
เนื่องจากโค้ดนี้ ฉันจึงค้นหาข้อมูลบนอินเทอร์เน็ตและรวบรวมบทความนี้เพื่อตรวจสอบ js เก่าแบบเรียลไทม์