Jquery 动态添加按钮实现代码

2020-05-22 17:02:55易采站长站整理

点击添加 动态添加两个文本框: 分别表示x和y的值,点击取消 删除本行的2个文本框

记得要引入jquery.js

<script type=”text/javascript” src=”js/jquery.js”></script>
<script type=”text/javascript”>
$(function() {
$(“#btnMian”).click(function() {
//生成 0 到100000 随机数 Mapth.random产生 0到1的随机数 然后乘以100000
var maxNumber = 100000;
var randomNumber = Math.round(maxNumber * Math.random());
// alert(randomNumber);
var s = “”;
s += “<table name='” + randomNumber + “‘ width=”450”><tr>”;
s += “<td width=”72”></td>”;
s += “<td width=”155” align=”left”>”;
s += “<input type=’text’ name=’m1′ /></td>”;
s += “<td align=”left” width=”155”><input type=’text’ name=’m1′ /></td>”;
s += “<td><a onclick=”del(” + randomNumber + “)” style=’cursor:pointer’>取消</a><span style=”color:red”></span></td></tr></table>”;
var $mm = $(s);
var $parent = $(“#mian”);
$parent.append($mm);
})
})
function del(aa) {
$(“#mian>table[name=” + aa + “]”).remove();
}
function checkForm() {
var txtItemName = $(“#txtItemName”).val();
if (txtItemName.replace(/[s]/g, ”).length < 1) {
$(“#lblMess”).html(“请输入项目名称”);
$(“#lblMess”).addClass(“onBlurClassError”);
return false;
}
var txtItemId = $(“#txtItemId”).val();
if (txtItemId.replace(/[s]/g, ”).length < 1) {
$(“#lblMess”).html(“请输入项目编号”);
$(“#lblMess”).addClass(“onBlurClassError”);
return false;
}
var txtUser = $(“#txtUser”).val();
if(txtUser.replace(/[s]/g,”).length<1)
{
$(“#lblMess”).html(“请输入巡查人员”);
$(“#lblMess”).addClass(“onBlurClassError”);
return false;
}
//循环遍历 文本框的值
var zheng = new RegExp(“(([0-9]+.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*.[0-9]+)|([0-9]*[1-9][0-9]*))$”);
var flag = true;
$(“[name=’m1′]:text”).each(function() {
if ($(this).val().replace(/[s]/g, ”).length < 1) {
$(“#lblMess”).html(“请输入 面 的坐标值!”);
$(“#lblMess”).addClass(“onBlurClassError”);