|
|
请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有账号？注册
x
3 t) A* U+ _; E9 L' M
; @; y# k1 k% x6 VJS 操作 Select相关功能测试. K1 J! g' ^ h9 ~+ ?+ z
( d/ \5 {: G+ N5 }3 k! b
[mw_shl_code=html,true]<html lang="en">
( E7 o( x7 v6 C& S- t6 z, k0 g
2 S+ _ J7 S6 x, L) \<head>6 a/ J: D/ j# C; V1 |5 _ A
<meta charset="UTF-8">
t6 x9 V/ o7 L8 l: [ <meta name="viewport" content="width=device-width, initial-scale=1.0">/ o0 U' j3 s! z/ Y0 Z0 p
<meta http-equiv="X-UA-Compatible" content="ie=edge">1 g5 b4 ]& j0 f& E. N3 S5 o
<title>Document</title>
2 [. j8 K* T9 W0 y" } <style>
1 w5 R1 _7 q0 R5 [! j( X v * {3 }2 `+ B H) M2 A3 R m3 h% V
font-size: 10px;
! h' H8 O1 F7 i3 y0 T3 M line-height: 24px;% X$ l, Q& W x
}0 J- L4 e# _: m
</style>
" p5 I: G* u G3 J- O" Z6 o</head>
8 {/ ^3 p; {& X6 L! P* Z
. D; j+ w- [; m4 M7 I3 q<body>8 Y4 U% w& ]. F# M6 R8 x
//this is for the select test
3 F( |" T) d# ]! ^( o <form id='myForm' action="submit" method="GET">
; X/ S) h; i5 a9 n <input type="text" id="inpuTChange" />
) n' d7 z, K7 j# b/ u$ x" p0 c) f1 q, r <select name="selectFruits" id="mySelect">9 y* ^, M [5 b: R( }' `
<option value="Orange1">Orange</option>
5 y; T( e& n$ J4 `3 X! q# @ <option value="Apple2">Apple</option>
2 E) j0 [, j) D! A& y2 l- @; U <option value="Banana3">Banana</option>5 Y# t2 a/ M* R
</select>: q& x: \! K; \2 J" I" F" O) \0 K( R
<br>
3 Z, B+ ^# k0 w. n <input type="button" value="disable">, d% A4 O% H9 k+ E% B
<input type="button" value="Able">+ W/ E% X6 h, _! H2 L% |
<input type="button" value="getValues">* ]$ f0 n6 @. ~) O4 B
<input type="button" value="editValues">5 b2 z0 @& M) w! e+ q! F6 K
<input type="button" value="addValues">
1 ?2 t. @8 K; B) y- w) o* r a <input type="button" value="removeValues">
4 u6 ^; U. q, j; ?( y, R( ^! l% Y- y/ P <br>
1 A1 x) a: E8 [& T+ L
$ @7 P1 J8 B- e3 v9 ^* ^ </form> _2 b# C1 Z2 ?) Y! `
: i# H& V5 i1 N5 v+ B6 b. Q <p id="demoInput"></p>/ L2 ]. x5 d+ B* k. D8 B: P9 A! B
6 }: E% K5 C: k/ E: K% m
+ o; L$ M F( W* ^8 E
<script>
: u7 C) n0 x6 Y) U9 z0 V" o6 r function disableFunc() {! ]; l! U4 P* i" i, ]0 p) h
document.getElementById('mySelect').disabled = true. {' u7 C! N: b9 I( a
}# r8 t, `+ i! f4 N7 S+ L
function ableFunc() {8 n O2 g& H2 ]# l2 R, d
document.getElementById('mySelect').disabled = false% V2 {) m( p$ b! {' W$ Z
}
$ E! U" P2 g1 x! z- T function getValues() {
( J1 o" ~* Z. g. E& Q) { var text = '<ul>'! N2 |2 T8 p U5 g2 y. ^
var x = document.getElementById('mySelect')
# B/ L8 h$ n# x( w2 y. R8 }& J for (var i = 0; i < x.length; i++) {
; v" I& |: S; D! `" L& t) z, ]9 H0 K text += '<li>' + x.text + '</li>'
. P. |1 D9 k+ ^8 S2 { }
; \6 f4 K# C. R6 M text += '</ul>'
8 t$ p( l2 ~: ]5 E7 [+ i document.getElementById('demoInput').innerHTML = text# N5 J& a/ O. B* }' j0 {8 y; D' r" Z( r v
}
, v1 |, W- n- J. Z+ ?
: v, u/ o/ T. D7 j7 ~3 p* `- ] function editValue() {: @3 w" q9 k& x* }
var mySelected = document.getElementById('mySelect')
: D- s& c q- }1 X/ m6 M { var selectedIndex = mySelected.selectedIndex
' v( b3 b8 H4 R* Q6 {6 {" ^ mySelected[selectedIndex].text = document.getElementById('inputChange').value7 Z' A5 _: E* r1 \
}
. M8 Y& C" i" ~6 y* x3 w. J, t U7 i* j- Y6 l6 V: u
function removeValue() {
" ]- V: A! |+ a, C var myselect = document.getElementById('mySelect')" j& D& R; v: [1 h; s4 |; Y- _ s
var selectedIndex = myselect.selectedIndex3 X/ [7 {: m# n4 e
myselect.remove(selectedIndex). L: B% Y, W% }* X# ~5 ^
}
' A/ J: Q4 ]. }# G2 M w: Q) H# K+ s function addValue() {$ g6 a$ J* I+ [, |
var myselect = document.getElementById('mySelect')
& X% @) H1 k' U6 F( b4 W var addvalue = document.getElementById('inputChange').value
. y' C, i$ r5 @ myselect.options.add(new Option(addvalue,"value"))3 |8 t# a) c, O, \% d b
}
7 C- r8 I8 O+ R* L </script>
4 p3 L2 Z$ |# `: o6 P</body>
& ]4 T u- W6 [$ ^) ?9 {8 d& l+ x% o I4 A5 Z& ]' Q" o( z" V
</html>[/mw_shl_code]0 L) n C6 f. ^+ n. P
|
|
|小黑屋|手机版|PLM之家-企业数智化转型工业软件学习平台
