直接贴源码：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>index</title>
<script src="./jquery.min.js"></script>
</head>
<style>
.my:focus{
outline:none;
opacity: 0;
}
.my:first-child{
position: absolute;
background-color:transparent;
border:1;
left:2px;
top:3px;
opacity: 0;
}
.area{
display: inline-block;
position: relative;
}
</style>
<body>
<div>
<h2>填空题 </h2>
<span>
1.我是
<div class="area">
<input type="text" class="my" maxlength="3" oninput="myfunc(this)" style="">
<input type="text" class="" readonly>
<input type="text" class="" readonly>
<input type="text" class="" readonly>
</div>
,我爱
<div class="area">
<input type="text" class="my" maxlength="3" oninput="myfunc(this)" style= "">
<input type="text" class="" readonly>
<input type="text" class="" readonly>
</div>。
</span>
<br>
<span>
2.
<div class="area">
<input type="text" class="my" maxlength="4" oninput="myfunc(this)" style= "">
<input type="text" readonly>
<input type="text" readonly>
<input type="text" readonly>
<input type="text" readonly>
</div>
编程使我快乐。
</span>
</div>
</body>
<script>
$('.my').click(function(){
var t=$(this).val();
$(this).val("").focus().val(t);
$(this).next().css('outline','1px solid #ffa');
});
myfunc=function(obj){
Val=obj.value;
$(obj).attr('str',Val);
area=$(obj).parent().find('input');
num=area.size()-1;
for (var i =1; i <=num; i++) {
console.log('初始数据'+Val[i-1]);
console.log(typeof(Val[i-1])=='undefined');
tmp=Val[i-1];
if(typeof(Val[i-1])=='undefined'){
// Val[i-1]='*';
tmp='';
}
console.log('输入显示数据'+tmp);
area[i].value=tmp;
};
}
</script>
</html>