|
|
请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有账号？注册
x
9 D* l5 q9 S; [: C6 y
7 j& ~& N- I& C( B) G; h: Q$ _JS 操作 Select相关功能测试
+ [# c; F O, [% v$ W( t6 t, H6 b9 B" f. X2 R1 D& i
[mw_shl_code=html,true]<html lang="en">, b1 m' k% F. ~' _
8 h7 o' L' K; r, W, W0 J<head>3 R% w4 R5 c' D; x# b
<meta charset="UTF-8">
, _. Z, C: f" Q5 ?# N; G4 Q <meta name="viewport" content="width=device-width, initial-scale=1.0">
$ d7 ^& ~5 ^4 D <meta http-equiv="X-UA-Compatible" content="ie=edge">! E1 E8 C$ O( Z) e1 D# U4 f/ j
<title>Document</title>' O1 l8 e- `9 E6 }' _1 m3 B5 L' ]% ]
<style>
0 h/ l4 h+ `9 A$ H) Z * {3 h; n. Z0 A5 ~7 @" g% J* ?+ x
font-size: 10px;
# i% k" k: N" C7 Y/ S line-height: 24px;" V# D2 N7 s( |& x
}2 c3 K8 w* E, O; @& r2 O5 L5 n
</style>
3 C* w! c' N* G1 ?) B</head>1 Z7 o j7 X- ^. ?; k5 Z
4 U0 j2 L0 o& w; @9 V# L
<body>
1 [/ C9 R' a. |: n //this is for the select test
0 L J; b5 t' G i <form id='myForm' action="submit" method="GET">
5 }+ O2 w, v% a$ Y* T4 T <input type="text" id="inpuTChange" />7 ~- T8 l6 G, `/ F
<select name="selectFruits" id="mySelect">' {& N0 H y, v7 ?1 u0 d
<option value="Orange1">Orange</option>
! |% w% |. G! e6 z1 Y$ e <option value="Apple2">Apple</option>
; m/ S2 W- i. k5 Y6 V4 W <option value="Banana3">Banana</option>
: [, V" I/ o* ~0 Y0 n </select>8 Y$ d7 U8 g* q9 V5 D
<br>
8 f) c p7 {7 D6 u- [ <input type="button" value="disable">
3 o- x5 d9 d0 g" R9 e2 _% w( _ <input type="button" value="Able">! X7 Y/ E( X; S
<input type="button" value="getValues">) Z+ j( y0 x( \, ~
<input type="button" value="editValues">
l Y' G2 H6 q/ M3 ]+ k <input type="button" value="addValues">1 e+ m- w" ~6 g) ?: v- `
<input type="button" value="removeValues">
3 c7 i: O a( O <br> u6 I: s- o8 |, U r# t2 W
. f; n- Y- \- Q- o4 k- K8 V </form>
^3 r0 T- R5 O9 U0 h
$ R8 l# ^/ D% g& }" s9 T* i- T3 } <p id="demoInput"></p>
& H% G% V |/ e5 ?: D5 d
; i" X; G) o- |/ Z$ W
; Z& h/ [% N% H4 O. L: l1 M1 s% P <script>
: v, x' B9 x# a% C. V% ^# _: f function disableFunc() {
/ F. G1 {/ J3 i, s document.getElementById('mySelect').disabled = true* b) x' K0 e9 @* u* L9 Z
}
2 R3 m0 g6 |* P; R5 ` function ableFunc() {3 k8 n* O" Z1 G
document.getElementById('mySelect').disabled = false
# z0 A z( ]5 Y }9 v, y2 H& @* s6 l- E
function getValues() {( |9 Z# T( O$ ^1 T8 V2 z% R
var text = '<ul>'
" H0 @7 b& ] j8 f' q9 o var x = document.getElementById('mySelect')6 b# p2 V: n9 s9 ~5 o2 H" Z2 n
for (var i = 0; i < x.length; i++) {
3 K T( O/ t8 P1 K$ ~( h text += '<li>' + x.text + '</li>'
% u+ [% Q3 m$ Q4 p- ~6 ^ }
! l5 \6 m4 s3 ?4 U- A text += '</ul>'
3 j0 Y* d! e$ f& [! O% n' u. [7 C document.getElementById('demoInput').innerHTML = text- \! I# L& ^) u7 J+ `( Q( M$ A
}
7 [2 u" b% L0 |
1 l( X2 @' M% j" X8 s; Y% o function editValue() {2 W0 K! e* U3 M4 B- y, z
var mySelected = document.getElementById('mySelect')
, p) u' Z9 n/ y) n7 U2 w' z! Y var selectedIndex = mySelected.selectedIndex
8 O- M& A; E- _ mySelected[selectedIndex].text = document.getElementById('inputChange').value: q5 t& U/ |0 f* B9 n" Y* l8 y3 Q
}, h/ [' e! D. x0 l! C0 k3 f9 N
3 w# t3 f7 J7 d* _) ~3 x. H/ l
function removeValue() {
5 G: V6 t8 w$ J z var myselect = document.getElementById('mySelect')
. g2 S( E, R0 N) u' h; m* _* [ var selectedIndex = myselect.selectedIndex: y8 W$ R, K! K% G
myselect.remove(selectedIndex) g+ _, x8 [3 ]& D8 M
}) w- n6 |: s8 J2 O5 k* O4 ~4 \
function addValue() {
2 G# ] I" K( y/ D var myselect = document.getElementById('mySelect')
- v( b9 e# |) }" J6 g3 ]4 v- d var addvalue = document.getElementById('inputChange').value. P0 u, v3 I5 f7 x
myselect.options.add(new Option(addvalue,"value")); Q2 h/ @2 @! e: M/ D: E
}
% r0 p( Q' F! E4 U) ~% E$ C7 i* u </script>7 k5 M0 m8 _! {. q0 t( _
</body>& {8 P4 }" P- a; y$ i
) T9 |: n& t# L1 \; ?7 ?! U" i</html>[/mw_shl_code]9 B* l3 F- q7 h2 S* e! m7 }
|
|
|小黑屋|手机版|PLM之家-专注工业软件生态建设，大模型CAD创新生态
