|
|
请使用QQ关联注册PLM之家,学习更多关于内容,更多精彩原创视频供你学习!
您需要 登录 才可以下载或查看,没有账号?注册
x
% c8 o$ L* }, p% v# X" V+ ?& G
( Q% N# T0 u( ^4 `0 XJS 操作 Select相关功能测试
8 ~/ }6 {2 t5 h z: X6 ?0 _4 e8 c! X) m
[mw_shl_code=html,true]<html lang="en">
* Y6 h9 W0 U, y3 b8 R$ D" |& p2 e+ ^- `6 k0 w
<head>' G. q# r6 c9 }" W
<meta charset="UTF-8">/ ~3 |3 Z, N p
<meta name="viewport" content="width=device-width, initial-scale=1.0">6 Y1 _2 C$ i/ p: a v$ r* r# I( u
<meta http-equiv="X-UA-Compatible" content="ie=edge">4 l6 D) S y" D- G3 ~
<title>Document</title>
0 ^4 M: `# J/ {& U0 { <style>4 A% Z4 r: L0 o! U4 X
* {" P4 O. S* ^5 D' ?9 W: O* G2 L! M
font-size: 10px;
5 b* h% m0 W$ a8 K( |$ V line-height: 24px;
5 Z- z+ E! X9 B3 I9 L) B }
8 w1 E0 l3 m+ f( }$ I' }# S </style>
7 a$ G1 O) Y7 n. }- [' r- T1 j</head>
0 `* V' z6 g! n9 R1 y% G; X- V/ G; ?' C1 h" T4 v
<body>
8 L3 J7 L4 j! w1 y: \ //this is for the select test
4 L* G4 `1 _! l" m: {3 d3 ], i" N <form id='myForm' action="submit" method="GET">! Z3 s+ Z1 \' n( @3 y9 a
<input type="text" id="inpuTChange" /># y* G9 z0 c6 f! Q
<select name="selectFruits" id="mySelect"> P" N. `( l, U" z: Y. c0 F0 k
<option value="Orange1">Orange</option>
8 D4 _+ ]- v; M <option value="Apple2">Apple</option>
! k) }1 I: q( U1 S7 l% B <option value="Banana3">Banana</option>
0 x# \; @4 o1 G </select>/ a( _. o( R- x% t6 C
<br>! ^$ i" C/ j" x" m. I3 Z( A6 Q
<input type="button" value="disable">
" o( o, \- g9 n3 M" H <input type="button" value="Able">7 B" M- r t* F, A1 d' S9 o
<input type="button" value="getValues">
, d& ^& h8 I' ?& i2 n4 L <input type="button" value="editValues">
Y* B. `0 n! D" D. b <input type="button" value="addValues"># g0 o. z1 `5 v8 X; s* w
<input type="button" value="removeValues">
( A! q3 v r. X7 S <br>
. m0 B8 _5 k+ } u, w3 p; n5 U9 A+ S& e# H
</form>/ Z( ~: N @. t5 ?0 ]) I
# [, `- ?6 {* i5 F <p id="demoInput"></p>
! _5 E5 _8 A+ U" Q7 Y) v6 U6 i0 h+ @ `0 ~9 i+ p5 }
# L' i8 t; ? X( C <script>% T$ x: r1 E5 U0 F
function disableFunc() {" |, F4 u3 C1 ?* P$ |
document.getElementById('mySelect').disabled = true
5 C( S6 \5 {7 A9 p7 V7 T }
" ^9 H+ s6 `4 `4 X+ l9 J- R function ableFunc() {
0 e) j/ o8 B5 k8 L3 Z- _5 F document.getElementById('mySelect').disabled = false5 s7 m/ b( S. M8 i8 c% S
}6 F! h) P( J# _/ z) j5 Z5 I
function getValues() {
6 a1 G# }4 k* _0 I var text = '<ul>'% W1 a+ T. J6 I' u" L- H8 B! U
var x = document.getElementById('mySelect')7 G' _0 S; [4 y. Q( o7 y* p1 w" s
for (var i = 0; i < x.length; i++) {* M& Z V2 v" p& H
text += '<li>' + x.text + '</li>': n; L& l( c2 @- ^ a
}
7 F$ I# M: \. c N0 t" [ text += '</ul>'+ E4 p6 ~. B6 S6 {! ~
document.getElementById('demoInput').innerHTML = text% e; S$ G& i) y( h% \& ~: O! W
}
1 v: s u$ E- F- d# `+ k$ h }
3 x5 I- |, H% c" D: x, j function editValue() {
$ }& t8 P5 f/ k& n8 _ T2 ^4 O" _ var mySelected = document.getElementById('mySelect')
; g" d% ]) J6 z& U7 |/ M var selectedIndex = mySelected.selectedIndex
3 t; j9 T$ f, j- K# b mySelected[selectedIndex].text = document.getElementById('inputChange').value: W; S9 P$ X5 b2 ~5 u' L
}
( n, A8 b9 G! A& V
+ w. \) n0 U7 [; C+ ~ function removeValue() {
! f; }& d! K) E' b( O5 o; k# `+ q var myselect = document.getElementById('mySelect')
2 `7 X. z* A/ f8 ? var selectedIndex = myselect.selectedIndex) b' r/ H x( N! w. n) ?, h: v% E
myselect.remove(selectedIndex), s- A; s, [3 d1 j! `/ t
}
0 r+ E9 M! H& M* x function addValue() { J4 h/ Y3 u4 z1 q
var myselect = document.getElementById('mySelect')2 L5 [1 c+ G8 G! |5 @! E
var addvalue = document.getElementById('inputChange').value6 q6 }: f1 B& x8 P& U7 z, K
myselect.options.add(new Option(addvalue,"value"))
- v' _" a8 U& f% i" B& Q }$ t% u0 X; u! {+ ^. A6 i" c* |
</script>- L1 [) B! u7 b- L4 G
</body>& \5 m4 N" |2 u. T
2 H5 V. l2 G; M. Z$ p9 |, K
</html>[/mw_shl_code]/ w# F' Z, |' l# f7 M9 h
|
|