文件结构
代码部分
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script src="./js/jquery-3.2.1.js"></script>
<script src="./js/jquery-3.2.1.min.js"></script>
</head>
<body>
<input type="text" class="input" /><input class="submit"type="submit" />
<h1>注意:</h1><p style="color:red;">请输入小写字母和大写字母组成的数据字符串。其它字符串无效。。。</p>
</body>
<script>
$(function(){
encryption();
});
/**
* 用于加密字符串
*/
function encryption(){
$('.submit').click(function() {
var char_one = "";//用于存放截取到的单个字符
var new_string = "";//用于存放加密后的字符串
var string_list = $('.input').val();//获取input输入的字符串
if(string_list.length != 0){
for (var i=0;i<string_list.length;i++)
{
char_one = string_list.substr(i, 1)//截取字符串中的单个字符
char_one = smail_or_big(char_one);
if(char_one == 0){
break;
}
char_one = String.fromCharCode(char_one);//把ascill转换成字符
new_string += char_one;//把加密后的单个字符拼装成字符串
}
if(char_one == 0){
alert('您输入的数据格式不正确,请重新输入。。。');
$('.input').val('');
}else{
alert("加密后的数据为:"+new_string);
}
}else{
alert('您还没有输入任何数据。。');
}
});
}
/**
* 用于判断此字符为小写字母还是大写字母
*/
function smail_or_big(char_one){
char_one = char_one.charCodeAt();//把单个字符转换成ascill
if(char_one >= 65 && char_one <=90){
return big_better(char_one);
}else if(char_one >= 97 && char_one <= 122){
return smail_better(char_one);
}else{
return 0;
}
}
/**
* 用于加密大写字母
*/
function big_better(char_one){
if(char_one > 86){
char_one = 4 - (90 - char_one) + 64;
return char_one;
}else{
char_one +=4;
return char_one;
}
}
/**
* 用于加密大写字母
*/
function smail_better(char_one){
if(char_one > 118){
char_one = 4 - (122 - char_one) + 96;
return char_one;
}else{
char_one +=4;
return char_one;
}
}
</script>
</html>
实现效果
1.界面样式,虽然难看点,但是凑合来吧。
2.正确运行效果
3.当什么也不输入时
4.当输入非法格式时