|
|
请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有账号？注册
x
' }. R9 S- f& o9 b0 d8 R
! j+ |7 x/ A, j; GJS 操作 Select相关功能测试
/ j; n4 m( m2 ?7 k% L( [: l+ U: u% W2 J# g. @$ x
[mw_shl_code=html,true]<html lang="en">( x# ^8 I7 \- u
! H e. X; q; Q6 ]/ J
<head>
+ |- X8 C, I1 Z# O, n* \ <meta charset="UTF-8">$ E0 b* l$ D9 R2 `1 `0 P
<meta name="viewport" content="width=device-width, initial-scale=1.0">+ k, s- N7 z0 N
<meta http-equiv="X-UA-Compatible" content="ie=edge">! x1 P x3 q) ^" B( w& q& X
<title>Document</title>
* U# [- C: }$ K. a <style>
6 Y! @1 y! H- h b: y% u * {
. |+ x7 x3 g+ s5 ], t& i font-size: 10px;
% }5 j5 c& O( B+ F+ L* T line-height: 24px;2 Q4 b. H. _5 U3 F, @
}
/ g/ g# F$ @# n) [9 u. B </style>% ?3 H; g, e; C
</head>
/ x) H1 r7 F" V. S. h
% L4 p- R* I' d {. N& B<body>: E1 J- x5 U/ _/ ]6 l" G' G# c
//this is for the select test9 `, Q! b- n: `
<form id='myForm' action="submit" method="GET">
2 c* w0 e- `) L* A9 @9 b: ` <input type="text" id="inpuTChange" />
: ~. z, g8 v% u0 \: `0 o <select name="selectFruits" id="mySelect">
4 P! q' O. r* s& ? <option value="Orange1">Orange</option>0 ~1 A+ L9 D1 z: X- L( P
<option value="Apple2">Apple</option>4 J/ ]! w6 x, S5 u" L `0 @% \
<option value="Banana3">Banana</option>' ~3 ]* B# r6 k% c- B' u
</select>) l8 v9 {) e. z$ U# p0 s6 Z
<br>9 l$ B" Z: L. f5 ?& }( ]
<input type="button" value="disable">8 X8 Q+ v' k, [- |% n8 p
<input type="button" value="Able">
" m$ F! u' r8 c7 i6 D <input type="button" value="getValues">
5 p( k/ [, L; c <input type="button" value="editValues">
( ` [% n. l( Y, D5 N* ~: e <input type="button" value="addValues">
1 D/ Y# \0 n1 u# T9 U; b. m <input type="button" value="removeValues">. R3 q$ T9 q0 t4 S' {( d' c
<br>. M3 h' Y! ?) j4 [0 V6 _
& J0 S( z; O% b% c3 q </form>
; b* _7 h7 ^+ b
8 R# ]" @2 G7 T( f0 S6 h4 A4 s <p id="demoInput"></p>4 h6 v% p8 S; J& V& |. i
8 }& X: m9 J1 Q! l" Y( f+ ~! S& G
6 \9 }: r) ?/ s" k% H% |' u <script>
" d; t& |8 R5 t function disableFunc() {- \ e _0 P" h& z/ l8 ~+ P/ m9 [
document.getElementById('mySelect').disabled = true
. L( S5 ?6 k; T+ N3 f& \6 p9 D# L V; ] }
$ {* y. W4 V# i) E7 D function ableFunc() {
9 J* Z7 w9 ~ X& M2 F& `; j% X* E! q document.getElementById('mySelect').disabled = false% X4 Q9 K2 S# W8 g" H/ z* Y
}5 J6 `/ ~* H* S. Z
function getValues() {
& ~1 M3 ^, F$ N" q var text = '<ul>'1 ]5 Q. q9 h& P! E) K" C1 R: {
var x = document.getElementById('mySelect')* e& ]5 Y( K! A6 y, y: H3 _+ c
for (var i = 0; i < x.length; i++) {
2 r! r" b: I5 B; s text += '<li>' + x.text + '</li>'9 G! ^" S4 R- V) ~) H
}
% v! D# J% O& y1 a text += '</ul>'6 X! b5 a: ^$ D6 c w! X! G6 t: {& x1 q
document.getElementById('demoInput').innerHTML = text& e2 b$ o. i, H4 V& I
}( @& l& t1 k# S0 T- U+ \7 K) V
6 i9 a# `6 {1 S8 J function editValue() {& y: g/ z3 R) Y" \) f+ W
var mySelected = document.getElementById('mySelect')0 Z, I- \% K5 R/ ^) O% d
var selectedIndex = mySelected.selectedIndex
, T: V1 R. U' r' l( O mySelected[selectedIndex].text = document.getElementById('inputChange').value, G' {2 I l# Q+ G$ Z( S# y
}
e, G0 o# t; R' w0 U' ^3 e0 `9 n: W: s, w" e
function removeValue() {
; a0 R" J4 ~* k+ M7 O var myselect = document.getElementById('mySelect')+ v: M. a6 r3 D; w. Y
var selectedIndex = myselect.selectedIndex
3 N9 E" C7 {& N$ [$ Y myselect.remove(selectedIndex)
# s2 g4 Z: f/ U6 O" f: n& | }$ d7 p, n+ u# Z0 o8 v" Z
function addValue() {
( O5 m( T6 g/ h$ S' o3 f6 J6 o* ? var myselect = document.getElementById('mySelect')
8 W5 s- v5 s; a3 o5 b" F& ^ var addvalue = document.getElementById('inputChange').value
* b% v3 y7 f$ H! _ myselect.options.add(new Option(addvalue,"value"))0 |/ K7 ^. r1 j& Q
}
& O M$ g1 x- q& \ </script>
[) i6 _- k" u; {2 H1 D5 M1 d</body>* S6 u( f: U9 J7 u( N: V
8 y; U, M5 V \# Y3 j8 s, F* q</html>[/mw_shl_code]
( k, [: Z7 [& z* Q9 C |
|
|小黑屋|手机版|PLM之家-企业数智化转型工业软件学习平台
