Question

我正在尝试创建一个简单的html表单，要求用户提供一些详细信息，一旦提交了该文本，就会将文本添加到文本框中的某些预定文本中。

这个例子......

文本框1 - 输入名称文本框2 - 输入年龄文本框3 - 输入位置

当提交此内容时，我希望将其添加到文本框中，或者甚至只在html页面上输出文本，其他文本已经存储，因此输出可能是“Hello John，你是25年老而来自伦敦“。

我所拥有的是非常基本的：

    <html>
    <form>
    Name: <input type="text" name="name"><br>
    Age: <input type="text" name="age"><br>
    Location: <input type="text" name="location"><br>
    <input type="submit" value="Submit">
    </form>
    <html>

除此之外，我不确定如何将所有值放入另一个带有其他预定文本的文本框中。

任何帮助或方向都将受到赞赏。

Answer 1

以下是解决方案，因此请使用document.getElementById()获取元素，使用click和element.onclick = function () {}将事件处理程序附加到alert()事件以显示消息框。< / p>

jsFiddle

<强>的JavaScript

var button = document.getElementById('test');
var name = document.getElementById('name');
var age = document.getElementById('age');
var location = document.getElementById('location');

button.onclick = function () {
    var str = 'Hello ' + name.value + 
        ', you are ' + age.value +
        ' years old and from ' + location.value;
    alert(str);
};

<强> HTML

<label>
    Enter name: 
    <input id="name" />
</label>
<br />
<label>
    Enter age: 
    <input id="age" />
</label>
<br />
<label>
    Enter location: 
    <input id="location" />
</label>
<br />
<button id="test">Test</button>

修改

要将其输出到页面，请使用element.innerHTML来设置元素的内容。

jsFiddle

output.innerHTML = str;

Answer 2

strcmp

function yes() {
var button = document.getElementById('test');
var name = document.getElementById('name');
var age = document.getElementById('age');
var location = document.getElementById('location');
    var str = 'Hello ' + name.value + 
        ', you are ' + age.value +
        ' years old and from ' + location.value;
    document.getElementById('test').innerHTML=str;
};

将多个HTML文本输入与存储的变量连接起来

2 个答案:

修改