|
|
请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有账号？注册
x
1 `2 ]& k# V; B, e$ S+ T# K
; L4 u# q/ v7 N& EJS 操作 Select相关功能测试& \( E V2 ]$ ~
* T* N/ X; f# ]7 ~
[mw_shl_code=html,true]<html lang="en">
" S, e2 \2 H; _8 y+ ]: E& F [3 ~3 w
<head>" m1 @6 G/ P: f! d. e
<meta charset="UTF-8">$ g# t- e3 o3 J. P2 _ S
<meta name="viewport" content="width=device-width, initial-scale=1.0">
. S6 g, n3 d% X <meta http-equiv="X-UA-Compatible" content="ie=edge">% R( B7 M, d9 H2 m
<title>Document</title>) i0 R1 ] {8 R' K8 U, m
<style>) F) P, v% P( [$ S
* {
1 ^8 l1 x2 `/ r* W; H font-size: 10px;4 X, ?. A9 d" b1 s6 s% a
line-height: 24px;4 h: m! C0 g+ t i& n( ]8 ]! e- V4 i
}
* V& p; j/ W7 ^0 D. Y3 ^% N' G/ x: h </style>, R7 G% Z& o$ y5 m. p2 h4 h& ?
</head>, T y; n0 O3 x8 m) S
& n G( S' c/ a4 o2 A8 g6 z
<body>/ k, q! R1 ?4 p8 t I; p/ {* ]3 H+ b5 }
//this is for the select test8 {) A* W% c* C* E8 f
<form id='myForm' action="submit" method="GET">
! [8 n1 s8 c+ Q6 N) x% Y, G. M1 ` <input type="text" id="inpuTChange" />, `3 U2 }( I$ M* T4 T6 R
<select name="selectFruits" id="mySelect">6 C1 V+ ?/ E0 B% i
<option value="Orange1">Orange</option>
' M) L# R% N! v* N! J <option value="Apple2">Apple</option>* V1 k# t0 b- A) R8 T
<option value="Banana3">Banana</option>4 ?! s; D+ f; F( x/ m, m5 A
</select>. x* P8 ~3 `( z9 }* E8 _
<br>
8 M! R/ L6 _# L$ w: h% { <input type="button" value="disable">! f( |0 Y% F4 M; \ G* ~3 r
<input type="button" value="Able">
3 f b; u1 ?9 A) q! h1 { <input type="button" value="getValues">( u2 o H& }. f& j
<input type="button" value="editValues">( t% Z2 |; z: @! \
<input type="button" value="addValues">
' ^( S/ N: Q9 w) r) M" u' s0 W <input type="button" value="removeValues">. N9 |+ O) i/ `5 R' z2 [ n) D
<br>
; j' n2 K+ N$ ?/ v( d. ]' ]- {* G3 G, n t y1 Q, O
</form>2 ?, X1 ~2 v/ n* b6 u) [. Q
" f; H8 C1 ]0 S! h+ o! H) [3 x <p id="demoInput"></p>
8 ?; [5 L8 v6 U" |$ x( Z" i
E$ `/ [; F- N7 a+ G
% w3 N, k6 O. G' V; ]4 g8 R4 U% _ <script>
* Y. J1 ~2 V( o function disableFunc() {
q# e! u. ]. i" q document.getElementById('mySelect').disabled = true- {! |+ ^( s) Q
}3 M2 ?* H( S$ b
function ableFunc() {
1 y' y0 j% f+ } document.getElementById('mySelect').disabled = false
. v$ U m, O' S, d }7 b3 P6 a" M4 W! {( x0 l
function getValues() {
1 O$ @% G! ?8 J: W8 u/ ` var text = '<ul>'
7 `- w& P4 m; q! C' z: o5 i var x = document.getElementById('mySelect'); v" I8 W% r- \* l
for (var i = 0; i < x.length; i++) {
/ x1 w9 U$ I& l2 t text += '<li>' + x.text + '</li>'( ]- c4 j, H/ P5 q/ @" B' S
}
# _4 s! P, f% I9 b9 P3 k4 ~" }; G text += '</ul>'! m* ]2 O) ?% j" K6 T+ k& ^$ N4 S2 p
document.getElementById('demoInput').innerHTML = text
" o: K: Y0 P: C9 L8 j }, y( M3 R+ m8 f- L
7 |2 N' `2 e- g9 H' l9 ]- B
function editValue() {0 }! ^8 F" o) a2 @1 W# ^
var mySelected = document.getElementById('mySelect')% f/ Q8 @( P2 _. h4 O
var selectedIndex = mySelected.selectedIndex
. N% n* Z7 M& S mySelected[selectedIndex].text = document.getElementById('inputChange').value, v7 F* b: G9 b( t
}5 K: `# k1 K; ~
- N. H5 w$ l. l1 j2 \ F
function removeValue() {
& l; ^% v3 A/ X0 B' \% O: h var myselect = document.getElementById('mySelect')
; |* x3 Z& V* e% [# K var selectedIndex = myselect.selectedIndex X8 N& i% D2 C- J
myselect.remove(selectedIndex)
# f1 g! R4 _1 |5 ~* Y/ b0 @' I q( a }0 B7 @* v+ W- Q7 N# l! T! F+ T2 V; S
function addValue() {( t) w! W* [# x, f1 U
var myselect = document.getElementById('mySelect')
' Y# p ]2 g' n8 J0 d |# E var addvalue = document.getElementById('inputChange').value9 b U, v% q0 j# J: z$ n! ~2 F
myselect.options.add(new Option(addvalue,"value"))
! Z0 r9 \% j5 g9 ~% m }
" e2 O; _, W( c# v2 u </script>( ~- [! M* f7 R+ @6 {6 T% \
</body>0 F8 e8 X' J9 F" G( P2 D
8 l. s6 @! T1 [. P, s
</html>[/mw_shl_code]
" u N- i& W! F+ a9 B" t |
|
|小黑屋|手机版|PLM之家-企业数智化转型工业软件学习平台
