怎样在HTML中插入按钮
1、打开Sublime text3,新建一个HTML文档,并且建立好框架。
2、输入代码:
<table>
<tr>
<td>Student</td>
<td><input type="text" name="student"></td>
</tr>
<tr>
<td>Height</td>
<td><input type="text" name="height"></td>
</tr>
<tr>
<td colspan=2>
<input type="button" name="add" value="add">
</td>
</tr>
</table>
设立两行文本输入框,并且提示可以增加的按钮。
3、<table id="mainTable">
为标签加上id方便定位。
4、加上监听事件的函数。
onclick="adding()"
然后连接js文档。
<script src="test.js"></script>
5、function adding(){
var table = document.getElementById("mainTable");
var addTr = table.insertRow(2);
}
创建函数,然后设定两个变量。一个用于定位标签位置,另一个增加行数在第二行。测试一下,多次点击确实会往下移动。
6、var addTd = addTr.insertCell();
addTd.innerHTML = "新增";
除了要增加tr还要增加td,并且增加文本提示。
7、稍微修改一下变量名字。再增加文本输入框。
function adding(){
var table = document.getElementById("mainTable");
var addTr = table.insertRow(2);
var td1 = addTr.insertCell();
td1.innerHTML = "新增";
var td2 = addTr.insertCell();
td2.innerHTML = "<input type='text 'name='newnew' >";
}
8、最后就可以看到按钮了。
<!--创建按钮-->
<input type="button" value="确定" id="btn">
<script>
//创建按钮对象
//通过id获取
var btn = document.getElementById("btn");
//按钮点击
btn.onclick=function(){
alert("你点击了确定");
}
</script>
<button>文字</button>
<script>alert(1)</script>
就可以
<input type="button" value="按钮上显示的文字">
或
<button>按钮上显示的文字</button>
他的功能是当你单击了这个按钮后他就打开服务器内指定的.php文件
广告 您可能关注的内容 |