动态添加一行文本框

最新推荐文章于 2022-09-20 18:48:41 发布

liuxin_0725

最新推荐文章于 2022-09-20 18:48:41 发布

阅读量692

点赞数

分类专栏： css样式 javascript

本文链接：https://blog.csdn.net/liuxin_0725/article/details/79487411

版权

javascript 同时被 2 个专栏收录

32 篇文章 0 订阅

订阅专栏

css样式

15 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<include file="Public/icon"/>
<title><{:C('CM_OOTB.NAME')}>-账户升级</title>
<link rel="stylesheet" href="__PUBLIC__/css/addseller.css">
<style type="text/css">
/* 导航区 */
#cm_nav .Rebate .icon{ background-color:#da5455; color:#FFF; background-position: -240px -295px;}
.Rebate .userrank{color:#fff!important;}

#primary{ margin: 15px;}

/* 说明区 */
#primary .biaoti,#primary .biaoti span{height:36px; line-height: 36px; font-size: 16px;}
#primary .biaoti{background:url(__PUBLIC__/img/icons1.png) 149px -423px no-repeat; margin-bottom: 15px;}
#primary .biaoti span{ display: block;float: left;}
#primary .biaoti .names{ width:150px; color:#fff; text-align: right; margin-right: 30px; background-color: #ed444b;}

#primary .remind{ height:60px; line-height:60px; background-color:#eee; color:#333; font-size:14px; padding-left: 15px;}
#primary .remind a{ display:inline-block; height:35px; line-height:35px; text-align:center; color:#fff; padding: 0 15px;
background-color:#00a030; margin:5px 10px auto 5px; }

#primary .data{ margin:50px auto ;}
#primary .button *{ float: left; color:#fff;}
.data .con input {width: 100px;}
#primary .button .reset{ display: block; width: 200px; height:50px; line-height: 50px; text-align: center; background-color: #00a030;}
</style>
</head>
<body>
<include file="Public/head"/>

<div class="breadcrumbs">
当前位置：
<a href="__MODULE__/Seller/index">消费赠送管理</a>
>
<a href="">账户升级</a>
</div>

<div id="primary">
<div class="biaoti">
<span class="names" st>角色升级费用设置</span>
</div>
<div class="remind">

<a class="reset" id="btn" >添加</a>

</div>

<form enctype="multipart/form-data" action="__MODULE__/Rebate/saveuserrank" method="post">

<ul class="data" id="dataul" >
<li >

<div class="con">
角色名称              
升级费用            
等级顺序

</div>

</li>
<volist name="data" id="vo">
<li >

<div class="con">
<input type="text" value="<{$vo.rankName}>" name="rankName[]" placeholder="角色名称" />
<input type="text" value="<{$vo['updateFee']/100}>" name="updateFee[]" placeholder="升级费用" />
<input type="text" value="<{$vo.rankOrder}>" name="rankOrder[]" placeholder="等级顺序" />
<input type='hidden' value="<{$vo.rankId}>" name='rankId[]' >

</div>

</li>
</volist>
<div class="button" id="div2">
<button type="submit" class="submit" style="width: 150px;margin-left: 240px;" >保存</button>

</div>

</ul>

</from>
</div>

<include file="Public/foot"/>

<script type="text/javascript">

$('#btn').click(function(){

$("#div2").before(" <li > <div class='con'> <input type='text' name='rankName[]' placeholder='角色名称' /> <input type='text' name='updateFee[]' placeholder='升级费用' /> <input type='text' name='rankOrder[]' placeholder='等级顺序' /> <input type='hidden' name='rankId[]' > <label class='la'>删除<label> </div> </li>");

})
$('.submit').click(function(){
// console.log($("#dataul").find("input[name='rankName[]']").length);
var flag =false;
$("input[name='rankName[]']").each(function (i) {
if($.trim($(this).val())==''){
alert('角色名称为空！');
$(this).focus();
flag =true;
return false;
}

});
if(flag) return false;
var reg =/^[0-9]+(.[0-9]{1,3})?$/;
$("input[name='updateFee[]']").each(function (i) {
if(!reg.test($.trim($(this).val()))){
alert('升级费用为空或者不为数字！');
$(this).focus();
flag =true;
return false;
}

});
if(flag) return false;
var reg2 = /^[0-9]*$/;
$("input[name='rankOrder[]']").each(function (i) {
if(!reg2.test($.trim($(this).val()))){
alert('等级顺序为空或者不为数字！');
$(this).focus();
flag =true;
return false;
}

});
if(flag) return false;

})
$('#dataul').on("click",".la",function(){
$(this).parent().parent().remove();
})
</script>

</body>
</html>