|
|
请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有账号？注册
x
@% }$ p, V- b \
& g K/ O! p1 yJS 操作 Select相关功能测试
5 @- l; Y8 Q4 b% `# C: {' z) k' G9 `
[mw_shl_code=html,true]<html lang="en">5 j% ^2 o6 b- `8 h$ N
( l1 f6 d* b/ d. K. c3 T<head>
4 k$ a( i- e7 X f! }" h4 r+ \ <meta charset="UTF-8">
( N& [( ?7 |% Z- z7 x- r5 a. b <meta name="viewport" content="width=device-width, initial-scale=1.0">' @% w# N2 U4 ~- ]- t; Z8 V
<meta http-equiv="X-UA-Compatible" content="ie=edge">
0 U7 u8 P$ N7 z H. G2 n8 a* p$ m9 r <title>Document</title>
% i6 b* o7 k/ J& R% w8 g <style>
2 }' B. n9 S+ V' t, E- | * {. g# ~4 r' j4 ?% E: }
font-size: 10px;
+ d- u7 g, c; w1 O line-height: 24px;4 }7 ^2 m) l6 P; h3 U/ G9 w
}
a5 \: K0 D0 O5 m, V </style>
; ?4 W; b, Q* c" [</head>
) v" u$ }6 B& U" _
; q4 Y, X8 l* [( V* p<body>
: M! }& |3 k7 }3 J //this is for the select test
1 C. \# j7 h$ ^/ ]3 T <form id='myForm' action="submit" method="GET">
! K& ^/ ]6 f) ]0 J1 ^1 v1 n <input type="text" id="inpuTChange" />" d: G+ G8 E/ r0 s& |
<select name="selectFruits" id="mySelect">
2 k6 L1 P1 s1 s( i$ A9 H6 A* ?. X0 N s <option value="Orange1">Orange</option>
& \/ U1 ]$ i: n) f9 P <option value="Apple2">Apple</option>
0 f( u' U. N c9 d <option value="Banana3">Banana</option>" q) R, X7 V1 ]$ E' {; u' R; g; I
</select>, @7 D+ L3 m! X/ o) t) m
<br>" s/ w% D; |* }4 y9 b; \; y# T
<input type="button" value="disable">
4 b" [( A& E' B) T' q* K <input type="button" value="Able">+ }- T5 {6 r: L0 k
<input type="button" value="getValues">: Z% L# l4 ~ c
<input type="button" value="editValues">6 |! z) v" M7 G7 p+ X0 e
<input type="button" value="addValues">
" B) A4 Z9 n B+ Z. z0 b( D* r3 \4 p6 O <input type="button" value="removeValues">) Q7 n% y |+ o# T
<br>
3 v. J |$ \( J/ s- K" X' k# B; t; x4 V/ z# R7 H) ~& v9 N
</form>
0 }! x, [5 d) \1 Y
, F% S6 W8 R& ]; K <p id="demoInput"></p># x( S' [: x1 @/ R' @! z) v2 a
3 J2 ^; V/ X1 U& [' l2 n
' b- T- d1 v, g# v; T1 m <script>
% y( Y; A5 c8 R; i" w function disableFunc() {( e% B# e7 f2 z0 ]
document.getElementById('mySelect').disabled = true
! Y& y% y% N3 q# U }* f' o0 m7 V0 C- B
function ableFunc() {7 Q8 Z( q! Q5 D# b2 p1 W$ N
document.getElementById('mySelect').disabled = false- E2 D1 M3 J4 ?( f; E: J; ]( R
}
8 |+ K8 ?% O+ } function getValues() {
! d9 o7 Z' q) N' f/ N var text = '<ul>'% o( c' S0 V8 F1 x
var x = document.getElementById('mySelect')( d4 P0 ^( R: o
for (var i = 0; i < x.length; i++) {/ h; ^- T& M2 M% f1 i; C8 I+ @; T
text += '<li>' + x.text + '</li>'
: f" u ^( `/ ^ }
/ x O* }! X7 O% R: H' b" W text += '</ul>'7 J5 J6 m4 m/ Q" p' n3 l8 \
document.getElementById('demoInput').innerHTML = text
/ j N3 C1 ?* Z, T8 g }# J& q }
o; v$ |# b- }$ v8 u @9 n* x- ]4 w6 J: c, Q4 N. X; U
function editValue() {
( a+ H: C) C2 J, n8 B var mySelected = document.getElementById('mySelect')
$ Y5 e4 l6 J1 W8 B" n6 E' F var selectedIndex = mySelected.selectedIndex
. y5 J8 V( i' V' V+ M1 y mySelected[selectedIndex].text = document.getElementById('inputChange').value6 @/ c# H- }2 k2 q
}
h3 R5 }* m. n; Z
7 Q) E( K+ j. q% C% P function removeValue() {* W. e. j! K6 {+ X' B
var myselect = document.getElementById('mySelect')
* {' a+ y- N ]0 f$ V& m3 I var selectedIndex = myselect.selectedIndex
M0 \& h) }8 b a7 x. O myselect.remove(selectedIndex)
0 b, l; }; l& p3 L }
( m+ L( L; g$ y5 N function addValue() {
9 P6 l% X3 }+ b8 G- J& u8 } var myselect = document.getElementById('mySelect')& E& L4 d; u7 Q) I5 h# @
var addvalue = document.getElementById('inputChange').value4 W: ]7 y/ U* V
myselect.options.add(new Option(addvalue,"value"))
3 u/ ]& O3 K) a! O }
; q& k( z y/ v% u7 W# x b5 S </script>
, d4 B* L( E) X" I' ?0 O4 ]: x</body>& {3 ^% o! A) h) c
# E) A$ i% \ y</html>[/mw_shl_code]0 c5 `) b [$ n! y0 X7 ]
|
|
|小黑屋|手机版|PLM之家-企业数智化转型工业软件学习平台
