大家来看看我的问题，很纠结啊，奉献自己所有积分。

messihahahehe 2012-09-14 03:21:32

大概实现如下功能，在一个输入框中输入字符，并将输入的字符显示在页面中的一个位置。现需要：在输入下划线"_"时候使用输入框代替下划线，并且能够计算下划线的个数来设置输入框的长度，输入下划线的数量和连续的个数不限，例如：姓名：____,年龄：______，希望各位大神能够帮帮小弟，感激不尽！

...全文

129 10 打赏收藏转发到动态举报

写回复

用AI写文章

10 条回复

切换为时间正序

请发表友善的回复…

发表回复

h123hu 2012-09-15

打赏
举报

看不懂要干什么啊？- -~！

geruilin2012 2012-09-15

打赏
举报

这不过好像不是什么大问题。

泡泡鱼_ 2012-09-14

打赏
举报

少发了个测试的输入框了。。。。

输入框：<input type="text" id="temp" value="" onkeyup="CreateFormTemplates()" />

泡泡鱼_ 2012-09-14

打赏
举报

给你写了个，可以实现你的要求，但感觉不是最好的。就当是抛砖引玉了，哪位朋友有更好的，别忘了贴出来。不知道光是正则能否实现？？

<script  type="text/javascript">

function CreateFormTemplates(){

    var _html=document.getElementById("temp").value;

    if(_html.length==0){document.getElementById("form").innerHTML='';return}

    var min=50;//输入框默认的长度

    var step=10;//每多一个_，递增的长度

    //将非_的全替换成$1

    var re=/[^_]/g;

    var str=_html.replace(re,'$1');

    var arr=str.split('$1');

    

    //以_分隔原内容

    var arr2=_html.split("_");

    

    //定义$1的真实文本存储数组

    var arr3=[];

    var newhtml='';//待写入的内容

    

    //获取$1对应的替换文本:以_分隔后,如果长度大于0的,则是一个文本

    for(i=0;i<arr2.length;i++){

        if(arr2[i].length>0){

            arr3.push(arr2[i]);

        }

    }

    

    //开始获取写入内容

    for(i=0;i<arr.length;i++){

        if(arr[i].length>0){

            var width=min+step*arr[i].length;

            newhtml+='<input type="text" style="width:'+width+'px">';

            if(arr3[i]){newhtml+=arr3[i]}

        }else{if(arr3[i]){newhtml+=arr3[i]}}

    }

    document.getElementById("form").innerHTML=newhtml;

}

</script>

<div id="form"></div>

一天要饭生活又开始啦 2012-09-14

打赏
举报

<!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>Untitled Document</title>
</head>

<body>
<input type="text" name="inputName" id="inputId" value=""/>
<input type="button" name="点击提交" id="btnId" />
<div id="xianShi">

</div>
<script type="text/javascript">
document.getElementById("btnId").onclick = function() {
var str = document.getElementById("inputId").value;
str=str.replace(/_/g,"<input type=\"text\" name=\"\" id=\"\" value=\"\"/>");
document.getElementById("xianShi").innerHTML = str;
}

</script>
</body>
</html>

一天要饭生活又开始啦 2012-09-14

打赏
举报

一天要饭生活又开始啦 2012-09-14

打赏
举报

泡泡鱼_ 2012-09-14

打赏
举报

汗~~手误。。。。少打了个width
<input type="input" style="width:80px">

泡泡鱼_ 2012-09-14

打赏
举报

[Quote=引用楼主的回复:]
大概实现如下功能，在一个输入框中输入字符，并将输入的字符显示在页面中的一个位置。现需要：在输入下划线"_"时候使用输入框代替下划线，并且能够计算下划线的个数来设置输入框的长度，输入下划线的数量和连续的个数不限，例如：姓名：____,年龄：______，希望各位大神能够帮帮小弟，感激不尽！
[/Quote]

制作表单模板？
在你处理：并将输入的字符显示在页面中的一个位置这个操作的时候。顺便处理就可以了，
假定：输入框初始长度设为50；每多一个_，就+10。假如有3个连在一起的_，那总长度就是：50+10*3=80;最后生成输入框时：
<input type="input" style="80px">

至于这个递增多少，你自己设置就可以了。大致的思路就是这样了