JQuery开关灯

最新推荐文章于 2024-04-17 14:05:20 发布

疯狂的自学者

最新推荐文章于 2024-04-17 14:05:20 发布

阅读量786

点赞数

分类专栏：学习的过程

本文链接：https://blog.csdn.net/weixin_41608454/article/details/79332914

版权

学习的过程专栏收录该内容

5 篇文章 0 订阅

订阅专栏

 
  <!DOCTYPE html> 
 
 
  < 
  html 
    
  lang 
  = 
  "en" 
  > 
 
 
  < 
  head 
  > 
 
 
   < 
  meta 
    
  charset 
  = 
  "UTF-8" 
  > 
 
 
   < 
  meta 
    
  name 
  = 
  "viewport" 
    
  content 
  = 
  "width=device-width, initial-scale=1.0" 
  > 
 
 
   < 
  meta 
    
  http-equiv 
  = 
  "X-UA-Compatible" 
    
  content 
  = 
  "ie=edge" 
  > 
 
 
   < 
  title 
  >模拟开关灯</ 
  title 
  > 
 
 
    
  < 
  script 
    
  src 
  = 
  './jquery.js' 
  > 
  < 
  / 
  script 
  > 
 
 
    
  < 
  style 
  > 
 
 
    
  .co 
  { 
  background 
  : 
  #acacac 
  }; 
 
 
   < 
  / 
  style 
  > 
 
 
  </ 
  head 
  > 
 
 
  < 
  body 
  > 
 
 
   < 
  input 
    
  type 
  = 
  "button" 
    
  value 
  = 
  "關燈" 
  > 
 
 
    
  < 
  script 
  > 
 
 
    
  $ 
  ( 
  function 
  (){ 
 
 
    
  var 
   onOff 
  = 
  true 
  ; 
  //创建一个开关 
 
 
    
  $ 
  ( 
  'input' 
  ). 
  on 
  ( 
  'click' 
  , 
  function 
  ( 
  e 
  ){ 
 
 
    
  if 
  ( 
  $ 
  ( 
  this 
  ). 
  val 
  ()  
  == 
    
  '關燈' 
  ){ 
 
 
    
  $ 
  ( 
  this 
  ). 
  val 
  ( 
  '開燈' 
  ); 
 
 
   } 
  else 
  { 
 
 
    
  $ 
  ( 
  this 
  ). 
  val 
  ( 
  '關燈' 
  ); 
 
 
   } 
 
 
   onOff 
  =! 
  onOff; 
 
 
    
  $ 
  (document.body). 
  toggleClass 
  ( 
  'co' 
  ); 
 
 
   }) 
 
 
   }) 
 
 
   < 
  / 
  script 
  > 
 
 
  </ 
  body 
  > 
 
 
  </ 
  html 
  > 
 

疯狂的自学者

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQuery开关灯

&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt; &lt;met
复制链接

扫一扫