如何将多个文本字段输出到一个页面

时间:2015-06-26 22:13:38

标签: javascript jquery html textfield

我的工作需要使用大量模板来向其他部门提交信息。为了避免有6个不同的模板,我想创建一个统一的简单html文档,允许我输入需要信息的简单文本字段,然后将该信息输出到同一页面上的另一个字段或打开一个新的页面完全。

例如:

<SPAN ID="copytext">
<b>**TOC Template**</b>
<br />
<br />
TOC,
<br />
<br />
Subscribers Impacted: <input type="text" id="text1" placeholder="How many"><br>
Business Name(s): <input type="text" id="text2" placeholder="Name of the business"><br>
Site ID: <input type="text" id="text3" placeholder="Site ID from Granite"><br>
</span>

<TEXTAREA ID="holdtext" STYLE="display:none;">
</TEXTAREA>
<BUTTON onClick="myFunction(); ClipBoard();">Copy to Clipboard</BUTTON> 
<script>
function myFunction() {
    document.getElementById("firstName").select();
}
</script>

<SCRIPT LANGUAGE="JavaScript">

function ClipBoard()
{
holdtext.innerText = copytext.innerText;
Copied = holdtext.createTextRange();
Copied.execCommand("Copy");
}

</SCRIPT>

我希望能够点击按钮,让它输出或复制页面上的所有信息,包括文本字段内的内容,以便我可以将其粘贴到我们的票务系统中。任何帮助将不胜感激!如果我可以将它复制到最简单的,但是如果我需要将它输出到同一页面上的单独部分,那也可以。

修改

以下是我要找的内容:

Subscribers Impacted: <input type="text" id="text1" placeholder="How many">        <br>
Business Name(s): <input type="text" id="text2" placeholder="Name of the         business"><br>
Site ID: <input type="text" id="text3" placeholder="Site ID from Granite"><br>

*这些文本字段旁边有。一旦我填写它们,我想将所有字段输出到另一个页面,这些页面将所有内容填入我可以复制它的所有位置。

看起来像这样:

Subscribers Impacted: One
Business Name: Mcdonalds
Site ID: GXQ9715

我目前所拥有的是一个上面有几个DIV的网页,当我点击模板的链接时,它会加载带有模板的html页面。我只是希望能够填写它,点击提交然后输出到没有文本字段的另一页。

1 个答案:

答案 0 :(得分:0)

您需要在html中使用JavaScript。这是一个例子

    <script>
        $(function () {
        $("#NameField").change(function () {
                        document.getElementById("NameBox").value = $("#NameField").val();

                    });
                    $("#NameField").keyup(function () {
                    document.getElementById("TheWord").value = $("#NameField").val().toUpperCase();});
        });
        </script>


    <input type="text" class="CustomWord" id="NameField" onkeydown="return alphaOnly(event);" name="NameField" value="Write Here" onfocus="if (this.value == 'Write Here') this.value = '';" onblur="    if (this.value == '') this.value = 'Write Here';"> 

<label for="TheWord">Word: </label><input readonly="readonly" id="TheWord" /><br />

基本上,创建文本字段并为每个文本字段提供一个ID,然后使用JavaScript执行任何这些文本字段更改的操作。有点像,如果带有ID blahText1的textbox1更改,将字符串复制到lable1或将文本复制到隐藏字段。