如何在HTML中添加输入框？

创建一个简单的input标签实现网页上的输入框效果。

添加输入框的步骤如下：

<input>标签用于搜集用户信息。根据不同的 type 属性值，输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。

工具：编辑器、浏览器

1、创建一个简单的input标签实现网页上的输入框效果，代码如下：

1 First name: <input type="text" name="fname" />2 Last name: <input type="text" name="lname" />3 <input type="submit" value="Submit" />

2、以上代码中type=text是文本的输入框，type=submit是一个提交按钮，运行的效果如下图：

添加多个输入框的方法如下：

<input id="input_template" name="name" maxlength="7" type="text" style="width: 120px">

<!-- 这里是一个模版，追加的时候用来克隆的。 -->

$('#addBtn').bind('click', function() {

var input_ = $("#input_template").clone()

$("#input_container").append(input_)

})

<!-- 需要注意的是，在追加的时候，或者追加之后，把追加元素imput的name和id重置一下。 -->

1文本输入框：<input type="text" name="name" placeholder="文本输入框"/>

2密码输入框： <input type="password" name="name" placeholder="密码输入框"/>

3单选框：<input type="radio" name="sex"/>男

<input type="radio" name="sex"/>女

4文件上传框：

上传文件：<input type="file" name="file"/>

5按钮框：

普通按钮：

<input type="button" name="button" value="普通按钮"/>

提交按钮：

<input type="submit" name="button2" value="提交"/>

清空按钮：

<input type="reset" name="button3" value="清空"/>

6复选框：

<input type="checkbox" name="checkbox"/>JAVA

7日期输入框：<input type="date" name="date"/>

8下拉框：

<select>

<option value="河南">河南</option>

<option value="北京">北京</option>

<option value="上海">上海</option>

<option value="深圳">深圳</option>

<option value="广州">广州</option>

</select>

9文本域：

<textarea cols="50" rows="10" placeholder="文本域"></textarea>

---