13顶

通过按钮选择数字对应的网页文字变红色的特效

稿源：互联网 2018-09-02 22:43:48 点击： 4960 撤稿纠错

通过按钮选择数字对应的网页文字变红色的特效...

以下讨论的是和按钮相关的通过按钮选择数字对应的网页文字变红色的特效教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
#status span{ font-style:normal}
#status .active{ color:red}
</style>
</head>
<body>
 <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
 <script>
  function getStatus(status){
   var str = '1.登记 → 2.部门负责人 → 3.单位负责人 → 4.领导 → 5.交办 → 6.办理 → 7.办结';
   var $t = $('#status');
   var $arr = $(str.split('→'));
   $t.html('');
   $arr.each(function(index, element) {
    var $span = $('<span>'+ this +'</span>');
    index>0 ? $t.append(' → ') : '';
    index+1==status ? $span.addClass('active') : '';
    $t.append($span);
   });
  }
  $(function(){
   getStatus(1);
  });
 </script>
 <button type="button" onclick="getStatus(1)">1</button>
 <button type="button" onclick="getStatus(2)">2</button>
 <button type="button" onclick="getStatus(3)">3</button>
 <button type="button" onclick="getStatus(4)">4</button>
 <button type="button" onclick="getStatus(5)">5</button>
 <button type="button" onclick="getStatus(6)">6</button>
 <button type="button" onclick="getStatus(7)">7</button>
 <div id="status"></div>
</body>
</html>

关于通过按钮选择数字对应的网页文字变红色的特效的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/2018090295252.shtml方便下次再访问哦。

·上一篇： 使用JQUERY实现json数据三级联动select表单列表特效
·下一篇： 利用CSS3实现雷达扫描效果图动画特效

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

通过按钮选择数字对应的网页文字变红色的特效

文章分类LIST >>返回首页

最新游戏

最新新闻