|
|
请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有账号？注册
x
6 y* w# ]" a3 w6 _
% v3 X( s! x; q* ?0 n; J+ PJS 操作 Select相关功能测试
* L9 a( z! l* f( _& D I5 h S7 ]6 ^+ b
[mw_shl_code=html,true]<html lang="en">
9 y* p5 b( H7 i8 x$ E6 p7 `2 j8 J$ B# w$ Y4 C U1 q
<head>
0 v0 Q% Q9 y' d4 {! A, S+ |! d <meta charset="UTF-8">7 U' x* @- O, O' a$ ?
<meta name="viewport" content="width=device-width, initial-scale=1.0">
9 E( B: F: P% l# l& \! F <meta http-equiv="X-UA-Compatible" content="ie=edge">3 v' G8 W m. g6 ], U6 W- G
<title>Document</title>
! S9 y4 c/ @8 v0 J7 ~ ~ <style>
) k+ b1 B! i6 \, j) x o5 l# w * {" I1 g$ `+ x6 c( F, B
font-size: 10px;
& F+ u2 G; X! n7 u line-height: 24px; b/ _* r4 p2 G
} F9 F1 |5 o0 f* D
</style>
2 j* N0 Q. M) Z- x* l2 u+ \( o. }</head>. g8 [ ?6 e6 ]' j
! j* y W' I& n% K$ f<body>$ a9 g8 O9 n1 E; K; w
//this is for the select test
" U8 m4 n7 i* ` <form id='myForm' action="submit" method="GET">) |0 f- E+ k* P: y
<input type="text" id="inpuTChange" />
- R+ I$ U. a+ n4 Y9 l- Z: k <select name="selectFruits" id="mySelect">- D5 i$ x/ ] t7 e5 ?
<option value="Orange1">Orange</option>, k3 C7 r2 S. e( |2 o9 z
<option value="Apple2">Apple</option>5 w* Z& O" |# t, S* q
<option value="Banana3">Banana</option>& ]- F( q& ?7 ^' P6 b
</select>8 z% c$ _, U% `' e$ K$ N
<br>9 V: n) p; V+ C$ H7 ~9 p2 D
<input type="button" value="disable">
: E- A- h: V) b9 g; J <input type="button" value="Able">" b6 B0 Z% J9 V' c, N8 D
<input type="button" value="getValues">' O8 ], _# Q3 g2 n' R0 L
<input type="button" value="editValues">' d/ r* `% S; V/ d
<input type="button" value="addValues">
5 w' r8 Y6 Z1 q8 ~) W, z8 Y B <input type="button" value="removeValues">$ u/ B( r+ h) G" W+ t
<br>/ ]3 ?$ |2 r! U: y
7 G4 J/ U+ L7 I1 J' R& m </form>
& N; Q" H! X$ A5 _; ~7 [! T3 f; c4 j# H+ l7 h% i
<p id="demoInput"></p>
, t0 R- o5 ?0 g/ A! g7 Y2 j. z& I% M- U* H) q- {
* \5 m$ l# {/ j1 h _6 T <script>: J! A! T) p: c
function disableFunc() {9 z* ^* Q; c+ B2 m+ H' T8 Y
document.getElementById('mySelect').disabled = true
K5 i. L! n3 j2 M, t' e' F! s5 w( m }
) i) u$ ?5 f( |3 j. [3 F3 {4 ] function ableFunc() {
" x& Q( r: ~. H$ i4 a6 `! t& M document.getElementById('mySelect').disabled = false
: o) J* P8 Y6 I1 M }
$ f* k$ ]' w' F( n4 D function getValues() {& N I+ Z2 i. K; B& N: W$ i, g: h
var text = '<ul>'
0 w# u7 `$ A, e2 o+ I var x = document.getElementById('mySelect')! a$ U5 J) A* _2 b( Z& I
for (var i = 0; i < x.length; i++) {
3 \8 U7 H: d" E+ Q text += '<li>' + x.text + '</li>'+ W: _" x' m+ ], ?8 R
}
; S8 g7 |# k* s* \# _1 P2 s+ w' Y text += '</ul>'/ F2 k/ n9 @5 B; }
document.getElementById('demoInput').innerHTML = text
0 d; _0 {8 R9 p' W) a T6 m) h5 B }7 K! n5 X* {! [
9 D3 _) i" `3 _$ \0 z e function editValue() {) r. q5 u; ^' j; E" U2 g
var mySelected = document.getElementById('mySelect'), [. D6 P9 a( a' C: H2 w* [
var selectedIndex = mySelected.selectedIndex
* Q+ D7 D3 W! A8 C* | mySelected[selectedIndex].text = document.getElementById('inputChange').value
9 D0 ~5 d! x0 g2 o4 U; R }" k/ K* S ]3 l5 v1 {" y
# j5 T, b8 }' O5 z& r5 P function removeValue() {
8 j8 E% p3 l: d F) ?! a var myselect = document.getElementById('mySelect')2 N. S4 g2 b9 s
var selectedIndex = myselect.selectedIndex
; q8 J3 w8 S$ `& l3 A& q% _ myselect.remove(selectedIndex)
& ^1 h' N8 `. P/ m/ v: ? }
* o2 e$ Z8 d" d- C5 a function addValue() {
$ B' T0 R: f% P var myselect = document.getElementById('mySelect')
% J+ v3 Z- B( d/ \! }7 w" V1 y8 Y9 Z var addvalue = document.getElementById('inputChange').value
) m! ]$ G" m4 A myselect.options.add(new Option(addvalue,"value"))* J# v4 i' F1 L+ a; H
}+ P1 V$ t. W+ @" u" y3 i
</script>. z" U8 q4 f7 L$ X# W( q
</body>* Y; z! |5 m% \
% Z3 @: A4 V" y$ |9 [( p _1 t</html>[/mw_shl_code]4 S n: Z* [: N' W: z
|
|
|小黑屋|手机版|PLM之家-企业数智化转型工业软件学习平台
