HTML 代码 :
复制代码代码如下:
<! Doctype html>
<html>
<adal>
<Title> Page Titre </TITME>
<style type = "text / css">
* {Font-Family: Consolas; Style de police: italique}
.Responsebox {largeur: 900px; marge: 10px auto; rembourrage: 10px; bordure: 2px solide # 366; border-radius: 10px 0 10px 0; Texte-aligne: Centre}
Entrée .Responsebox, bouton .Responsebox {Font-Size: 30px; marge: 5px; padding: 5px;}
.Sspansuper {Vertical-Align: Super; Font-Size: 14px}
.Spanbottom {Vertical-Align: Text-Bottom; Font-Size: 12px; marge-left: -110px}
#showbox {width: 900px; hauteur: 430px; bordure: 5px solide # 663; border-radius: 0 20px 0 20px; marge: 10px auto; padding: 8px; police-size: 20px}
</ style>
</ head>
<body>
<div>
<h1> JavaScript Base64 Encode et décode <span> [email protected] </span> <span> 2014-12-27 17:44 </span> </h1>
<input type = "text" id = "input">
<input type = "checkbox" id = "checkbox" checked = "checked"> base64 </ entrée>
<Button id = "btn"> Convertir Done! </futton>
</div>
<div id = "showbox"> </div>
</docy>
<script type = "text / javascript">
/ * javascript : :
* 函数 : window.atob () window.btoa () unescape () Escape () encodeuRIComponent () decodeuRIComponent ()
* 正则表达式清除首位空格 : _String.replace (/ (^ / s *) | (/ s * $) / g, "");
*
* Covertbase64Orstring 自执行函数
* ID INPUTID 输入框
* Checkboxid 选择框 ID
* btnid 按钮 id
* showid html 显示容器 id , 这里是一个 div # showbox
* /
(fonction CoverTBase64Orstring (InputId, CheckBoxId, Btnid, Showid) {
var checkbox = document.getElementById (CheckBoxId); // html Dom sélectionnez à cocher
var chkvalue = checkbox.getAttribute ("vérifié"); // html Dom se sélectionner vérifié
var btn = document.getElementById (btnid); // ID de bouton Sélectionner HTML DOM
var isBase64; // Base64ToString ou StringTobase64 Bool
var returnVal = null; // chaîne convertie
chkvalue == "vérifié"? isBase64 = true: ISBase64 = false; // 判断 Vérifiez 按钮初始化状态 赋值 ISBase64
checkbox.addeventListener ("cliquez", fonction (e) {// checkbox 点击事件注册
var _ckvak = checkbox.getAttribute ("vérifié"); // 点击事件发生时 , 改变 Vérifiez 状态 , 赋值 ISBASE64
if (_ckvak == "vérifié") {
checkbox.setAttribute ("vérifié", null);
isBase64 = false;
} autre {
checkbox.setAttribute ("vérifié", "coché");
isBase64 = true;
}
}, vrai);
btn.addeventListener ("cliquez", fonction (e) {// bouton 点击事件注册
var _show = document.getElementById (showId); // HTML DOM Sélectionnez ID Showbox
var _inputValue = document.getElementById (inputId) .Value; // 文本框取值
//_inputValue=_InputValue.replace(/(^/S*)|(/S*$)/G, ""); // 正则表达式去除首位空格 , 似乎 btoa , abob 已经做了这些工作
var _showlngth = _show.childnodes.length; // 遍历 showbox , 清除 showbox 内容
while (_showlthength> 0) {
_show.removechild (_show.childNodes [_shOwLNGNGKET - 1]);
_shOwLNGNEGHT--;
}
if (isBase64) {// chaîne à la base64 , 支持中文编码 , Unescape , EncodeuriComponent
returnVal = window.btoa (UnEscape (EncodeuRIComponent (_inputValue)));
} else {// base64 à la chaîne
returnVal = decodeuComponent (Escape (Window.atob (_inputValue)));
}
_show.ApendChild (document.CreateTextNode (returnVal)); // Ajouter un contexte à Showbox
}, vrai);
}) ("entrée", "cochéage", "btn", "showbox");
// CoverTBase64Orstring ("Entrée", "Checkbox", "BTN", "Showbox");
</cript>
</html>
:
推荐一个 javascript ide 比 aptana 还好用。komodo ide (免费版 : komodo edit , 基本功能一样) 支持语法高亮 , 智能感知 , 还支持 perl , python , ruby , nodejs 语法等。