浅谈Javascript Base64 加密解密

html代码：

代码如下:

<!DOCTYPE html>
 <html>
 <head>
     <title>Page Title</title>
     <style type="text/css">
     *{font-family: Consolas;font-style: italic}
     .responsebox{width:900px;margin:10px auto;padding:10px;border:2px solid #366;border-radius: 10px 0 10px 0; text-align: center}
     .responsebox input,.responsebox button{font-size: 30px;margin:5px;padding:5px;}
     .spansuper{vertical-align: super;font-size: 14px}
     .spanbottom{vertical-align: text-bottom;font-size: 12px;margin-left: -110px}
     #showbox{width:900px;height:430px;border:5px solid #663;border-radius: 0 20px 0 20px;margin:10px auto;padding:8px;font-size: 20px}
     </style>
 </head>
 <body>
 <div class="responsebox">
     <h1>Javascript Base64 Encode & Decode<span class="spansuper">veinyf@gmail.com</span><span class="spanbottom">2014-12-27 17:44</span></h1>
     <input type="text" id="input">
     <input type="checkbox" id="checkbox" checked="checked">Base64</input>
     <button id="btn">Convert done !</button>
 </div>
 <div id="showbox"></div>
 </body>
 <script type="text/javascript">
     /*javascript知识：
      *函数：window.atob()    window.btoa()   unescape() escape() encodeURIComponent() decodeURIComponent()
      *正则表达式清除首位空格：_string.replace(/(^\s*)|(\s*$)/g,"");
      *
      *CovertBase64orString自执行函数
      *inputid   输入框id
      *checkboxid    选择框id
      *btnid 按钮id
      *showid    html显示容器id，这里是一个div#showbox
      */
 (function CovertBase64orString(inputid, checkboxid, btnid, showid) {
     var checkbox = document.getElementById(checkboxid); //html dom select checkbox
     var chkvalue = checkbox.getAttribute("checked");    //html dom select checkedvalue
     var btn = document.getElementById(btnid);           //html dom select button id
     var isbase64;                                       //base64toString or StringtoBase64 bool
     var returnval = null;                               //Converted string
     chkvalue == "checked" ? isbase64 = true : isbase64 = false; //判断check按钮初始化状态 赋值isbase64
     checkbox.addEventListener("click", function(e) {            //checkbox 点击事件注册
         var _ckvak = checkbox.getAttribute("checked");          //点击事件发生时，改变check状态，赋值isbase64
         if (_ckvak == "checked") {
             checkbox.setAttribute("checked", null);
             isbase64 = false;
         } else {
             checkbox.setAttribute("checked", "checked");
             isbase64 = true;
         }
     }, true);
     btn.addEventListener("click", function(e) {                    //button 点击事件注册
         var _show = document.getElementById(showid);               //html dom select showbox id
         var _inputvalue = document.getElementById(inputid).value;   //文本框取值
         //_inputvalue=_inputvalue.replace(/(^\s*)|(\s*$)/g, "");    //正则表达式去除首位空格，似乎btoa，abob已经做了这些工作
         var _showlength = _show.childNodes.length;                  //遍历showbox，清除showbox内容
         while (_showlength > 0) {
             _show.removeChild(_show.childNodes[_showlength - 1]);
             _showlength--;
         }
         if (isbase64) {  //string to base64，支持中文编码，unescape，encodeURIComponent
             returnval = window.btoa(unescape(encodeURIComponent(_inputvalue)));
         } else {        //base64 to string
             returnval = decodeURIComponent(escape(window.atob(_inputvalue)));
         }
         _show.appendChild(document.createTextNode(returnval));          //add context to showbox
     }, true);
 })("input", "checkbox", "btn","showbox");
 //CovertBase64orString("input", "checkbox", "btn","showbox");
 </script>
 </html>

效果：

推荐一个Javascript IDE 比Aptana还好用。Komodo IDE（免费版：Komodo Edit，基本功能一样）支持语法高亮，智能感知，还支持perl，python，ruby，nodejs语法等。

赞 (0)

相关推荐

  • jQuery加密密码到cookie的实现代码

    废话不多说了,直接给大家贴代码了,具体代码如下所示: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <table> <tr> <th>账号:</th> <td><input

  • Javascript实现base64的加密解密方法示例

    这几天使用PHP向前端传值的时候,遇到一个问题,要将代码传过去赋值.如果使用urlencode()和urldecode()函数,就会出现js无法解码的情况,因为php和js的相关函数算法不一致.于是准备使用通用的base64加密解密. base64 加密解密 下方是base64用javascript写出来的函数和方法. //1.加密解密方法使用: //1.加密 var str = '124中文内容'; var base = new Base64(); var result = base.enco

  • Js base64 加密解密介绍

    复制代码 代码如下: <script type="text/javascript"> var base64encodechars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/"; var base64decodechars = new Array( -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1,

  • jQuery实现base64前台加密解密功能详解

    本文实例讲述了jQuery实现base64前台加密解密功能.分享给大家供大家参考,具体如下: 关于加密,很多人想到encodeURI和escape.这个对加密url,尤其是带中文参数的url很有用. 如果只是想做加密解密,类似于Java的DES,网上jQuery有个jquery.base64.js. (关于js的md5加密可以用jquery.md5.js,有兴趣可以找来测试一下). 下面是测试: <html> <head> <title></title> &

  • jQuery MD5加密实现代码

    $(md("你想要加密的字符串")); md5插件下载地址:http://xiazai.jb51.net/201003/yuanma/jquery_md5.rar 下面是我的简单例子 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"

  • JS实现的base64加密解密完整实例

    本文实例讲述了JS实现的base64加密解密.分享给大家供大家参考,具体如下: 完整的代码: <HTML> <HEAD> <TITLE>Base64</TITLE> <script language=javascript> var base64EncodeChars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/"; var base64D

  • jQuery+C#实现参数RSA加密传输功能【附jsencrypt.js下载】

    本文实例讲述了jQuery+C#实现参数RSA加密传输功能.分享给大家供大家参考,具体如下: 注意: 参数传递的+号处理,在传输时会把+变成空格,不处理后端就报错了. 1.前端代码 <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>Login</title> <

  • jQuery简单实现MD5加密的方法

    jQuery简单实现MD5加密的方法

    本文实例讲述了jQuery简单实现MD5加密的方法.分享给大家供大家参考,具体如下: 1.问题背景 有两个输入框,一个输入明文,另一个输入框显示密文 2.实现源码 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>jQuery实现MD5加密</title> <script type="text/javascript"

  • 浅谈Javascript Base64 加密解密

    浅谈Javascript Base64 加密解密

    html代码: 复制代码 代码如下: <!DOCTYPE html>  <html>  <head>      <title>Page Title</title>      <style type="text/css">      *{font-family: Consolas;font-style: italic}      .responsebox{width:900px;margin:10px auto;pa

  • 浅谈JavaScript 浏览器对象

    浅谈JavaScript 浏览器对象

    window window对象不但充当全局作用域,而且表示浏览器窗口. window对象有innerWidth和innerHeight属性,可以获取浏览器窗口的内部宽度和高度.内部宽高是指除去菜单栏.工具栏.边框等占位元素后,用于显示网页的净宽高.还有一个outerWidth和outerHeight属性,可以获取浏览器窗口的整个宽高. 补充: 网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:

  • JS实现的3des+base64加密解密算法完整示例

    JS实现的3des+base64加密解密算法完整示例

    本文实例讲述了JS实现的3des+base64加密解密算法.分享给大家供大家参考,具体如下: 1. index.html: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>www.jb51.net BASE64编码</title> <meta http-equiv="Content-Type" content="text/html; c

  • JS实现的base64加密解密操作示例

    JS实现的base64加密解密操作示例

    本文实例讲述了JS实现的base64加密解密操作.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>js base64加密解密</title> </head> <body> <script> // 创建Base64对象 var Base64 = { _keyStr: &qu

  • 浅谈javascript运算符——条件,逗号,赋值,()和void运算符

    前面的话 javascript中运算符总共有46个,除了前面已经介绍过的算术运算符.关系运算符.位运算符.逻辑运算符之外,还有很多运算符.本文将介绍条件运算符.逗号运算符.赋值运算符.()和void运算符 条件运算符 条件运算符是javascript中唯一的一个三元运算符(三个操作数),有时直接称做'三元运算符'.通常这个运算符写成'?:',当然在代码中往往不会这么简写,因为这个运算符拥有三个操作数,第一个操作数在'?'之前,第二个操作数在'?'和':'之间,第三个操作数在':'之后 varia

  • go语言base64加密解密的方法

    本文实例讲述了go语言base64加密解密的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: package main import (     "encoding/base64"     "fmt" ) const (     base64Table = "123QRSTUabcdVWXYZHijKLAWDCABDstEFGuvwxyzGHIJklmnopqr234560178912" ) var coder = base6

  • 浅谈JavaScript中面向对象的的深拷贝和浅拷贝

    理解深拷贝和浅拷贝之前需要弄懂一些基础概念,内存中存储的变量类型分为值类型和引用类型. 1.值类型赋值的存储特点, 将变量内的数据全部拷贝一份, 存储给新的变量. 例如:var num = 123 :var num1=num; 表示变量中存储的数字是 123.然后将数据拷贝一份,就是将 123 拷贝一份. 那么内存中有 2 个 数组;将拷贝数据赋值给 num2,其特点是在内存中有两个数据副本.这可以理解为浅拷贝. 2.引用类型的赋值. var o={name:'张三'}: var obj=o;

  • 浅谈javascript中的constructor

    constructor,构造函数,对这个名字,我们都不陌生,constructor始终指向创建当前对象的构造函数. 这里有一点需要注意的是,每个函数都有一个prototype属性,这个prototype的constructor指向这个函数,这个时候我们修改这个函数的prototype时,就发生了意外.如 function Person(name,age){ this.name = name; this.age = age; } Person.prototype.getAge = function

  • java实现Base64加密解密算法

    Base64是网络上最常见的用于传输8Bit字节代码的编码方式之一,大家可以查看RFC2045-RFC2049,上面有MIME的详细规范.Base64编码可用于在HTTP环境下传递较长的标识信息.例如,在Java Persistence系统Hibernate中,就采用了Base64来将一个较长的唯一标识符(一般为128-bit的UUID)编码为一个字符串,用作HTTP表单和HTTP GET URL中的参数.在其他应用程序中,也常常需要把二进制数据编码为适合放在URL(包括隐藏表单域)中的形式.

随机推荐