點(diǎn)擊添加表格逗威,修改ID和type,功能


<!DOCTYPE html>
<html lang="en">
<head>

<title>店主信息</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<link rel="stylesheet" type="text/css" href="../../resources/css/loanDetail.css" />

</head>
<body>
<input type="hidden" id="projectId" value="${projectId}"></input>
<input type="hidden" id="bossinfoId"></input>
<input type="hidden" id="propertyId"></input>
<input type="hidden" id="carId"></input>
<div id="wrapper">
    <!-- Navigation -->
    <jsp:include page="/page/common/menu.jsp" >
        <jsp:param value="2" name="menu"/>
        <jsp:param value="1" name="index"/>
    </jsp:include>
    <div id="page-wrapper">
        <div class="container-fluid">

            <!-- Page Heading -->
            <div class="row">
                <div class="col-lg-12">
                    <h1 class="page-header">
                                
                     </h1>
                </div>
            </div>
<!-- /.row -->
<div class="row">
    <div class="container-fluid">
        
        <!--修改的內(nèi)容-->
        <div class="contain-table"> 
            <div >
                基本信息
                <!--點(diǎn)擊添加的標(biāo)簽-->
                <span class="add-basic"><i class="add-info  cancel"></i><i class="change-cont">添加</i></span>
            </div>
            <div class="complete-info" id="complete-info"> 
                <div class="table-basic">
                    <table border="1" class="basic-info" id="basic">
                        <tr>
                            <th>信息項(xiàng)</th>
                            <th>信息內(nèi)容</th>                                                                       
                        </tr>
                        <tr>
                            <td>姓名</td>
                            <td><input type="text" placeholder="請輸入" id="name"/></td>                                   
                        </tr>
                        <tr>
                            <td>電話</td>
                            <td><input type="text" placeholder="請輸入" id = "phone"/></td>                                                    
                        </tr>
                        <tr>
                            <td>股份占比</td>
                            <td> <input type="text" placeholder="請輸入" id = "shares"/></td>                                                  
                        </tr>
                        <tr>
                            <td>身份證號</td>
                            <td><input type="text" placeholder="請輸入" id = "identityCard"/></td>                                                 
                        </tr>
                        <tr>
                            <td>身份證正面</td>
                            <td>
                                <div class="table-td">
                                    <input type="file" accept="image/*"/>
                                    <a><img  class = "verifyPic" src="http://file.88mmmoney.com/49536eb9-1aff-477a-8d43-e08910819608" id = "identityCardFrontPic"/></a>                                                                 
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>身份證背面</td>
                            <td>
                                <div class="table-td">
                                    <input type="file" accept="image/*"/>
                                    <a><img  class = "verifyPic" src="http://file.88mmmoney.com/49536eb9-1aff-477a-8d43-e08910819608" id = "identityCardBackPic"/></a>                                                                  
                                </div> 
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>現(xiàn)在住址</td>
                            <td>
                                <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "livingAddress"/>
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>戶口所在地</td>
                            <td>
                                 <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "residenceAddress"/>
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>學(xué)歷</td>
                            <td>
                                <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "education"/>
                                </div> 
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>畢業(yè)院校</td>
                            <td>
                                <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "school"/>
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>畢業(yè)證</td>
                            <td>
                                <div class="table-td">
                                    <input type="file" accept="image/*"/>
                                    <a><img  class = "verifyPic" src="http://file.88mmmoney.com/49536eb9-1aff-477a-8d43-e08910819608" id = "diplomaPic"/></a>                                                                   
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>學(xué)位證</td>
                            <td>
                                <div class="table-td">
                                    <input type="file" accept="image/*"/>
                                    <a><img  class = "verifyPic" src="http://file.88mmmoney.com/49536eb9-1aff-477a-8d43-e08910819608" id = "degreePic"/></a>                                                                    
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>專業(yè)</td>
                            <td>
                                <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "major"/>
                                </div> 
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>是否繳納社保</td>
                            <td>
                                <div class="table-td">
                                    <input   type="radio"  name="socialSecurity" value="yes"/><label class="one">是</label>
                                    <input  type="radio"  name="socialSecurity" value="no"/><label class="two">否</label>
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>繳納社保年限</td>
                            <td>
                                <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "socialSecurityYear"/>
                                </div> 
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>婚姻情況</td>
                            <td>
                                <div class="table-td">
                                    <input   type="radio"  name="marriage" value="married"/><label class="one">已婚</label>
                                    <input  type="radio"  name="marriage" value="single"/><label class="two">未婚</label>
                                    <input  type="radio"  name="marriage" value="divorced"/><label class="two">離異</label>
                                </div> 
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>結(jié)婚證</td>
                            <td>
                                <div class="table-td">
                                    <input type="file" accept="image/*"/>
                                    <a><img  class = "verifyPic" src="http://file.88mmmoney.com/49536eb9-1aff-477a-8d43-e08910819608" id = "marriageCertificatePic"/></a>                                                                   
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>配偶姓名</td>
                            <td>
                                <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "spouseName"/>
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>配偶聯(lián)系方式</td>
                            <td>
                                <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "spouseContact"/>
                                </div>
                            </td>  
                        </tr>
                        <tr>
                            <td>配偶身份證號</td>
                            <td>
                                <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "spouseIDCard"/>
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>配偶身份證正面</td>
                            <td>
                                <div class="table-td">
                                    <input type="file" accept="image/*"/>
                                    <a><img  class = "verifyPic" src="http://file.88mmmoney.com/49536eb9-1aff-477a-8d43-e08910819608" id = "spouseIDCardFrontPic"/></a>                                                                 
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>配偶身份證背面</td>
                            <td>
                                <div class="table-td">
                                    <input type="file" accept="image/*"/>
                                    <a><img  class = "verifyPic" src="http://file.88mmmoney.com/49536eb9-1aff-477a-8d43-e08910819608" id = "spouseIDCardBackPic"/></a>                                                                  
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>是否生育</td>
                            <td>
                                <div class="table-td">
                                    <input   type="radio"  name="giveBirth" value="yes"/><label class="one">是</label>
                                    <input  type="radio"  name="giveBirth" value="no"/><label class="two">否</label>
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>子女?dāng)?shù)量</td>
                            <td>
                                <div class="table-td">
                                    <input type="number" placeholder="請輸入" id = "childrenNum"/><span>人</span>
                                </div> 
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>子女戶口頁資料</td>
                            <td>
                                <div class="table-td">
                                    <input type="file" accept="image/*"/>
                                    <a><img  class = "verifyPic" src="http://file.88mmmoney.com/49536eb9-1aff-477a-8d43-e08910819608" id = "childrenResidencePic"/></a>
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>全國法院被執(zhí)行人信息查詢</td>
                            <td>
                                <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "executionInfo"/>
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>被執(zhí)行人信息查詢照片</td>
                            <td>
                                <div class="table-td">
                                    <input type="file" accept="image/*"/>
                                    <a><img  class = "verifyPic" src="http://file.88mmmoney.com/49536eb9-1aff-477a-8d43-e08910819608" id = "executionInfoPic"/></a>
                                </div> 
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>深圳法院網(wǎng)上訴訟平臺查詢</td>
                            <td>
                                <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "litigationInfo"/>
                                </div>
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>訴訟信息查詢照片</td>
                            <td>
                                <div class="table-td">
                                    <input type="file" accept="image/*"/>
                                    <a><img  class = "verifyPic" src="http://file.88mmmoney.com/49536eb9-1aff-477a-8d43-e08910819608" id = "litigationInfoPic"/></a>
                                </div> 
                            </td>                                                   
                        </tr>
                        <tr>
                            <td>從業(yè)經(jīng)歷</td>
                            <td>
                                <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "workingExperience"/>
                                </div>
                            </td>                                                   
                        </tr>
                        
                    </table>                                                                       
                    <button type="button" id="submit">保存</button>
                </div>
                <div class="house" id="realEstate">
                    <div class="">  
                        房產(chǎn)/其他資產(chǎn)
                        <span class="add-house"><i class="add-info  cancel-house"></i><i class="change-cont">添加</i></span>
                        
                    </div>
                    <div class="table-house" id="house-info">
                        <table border="1" class="house-info">
                            <tr>
                                <td>類型</td>
                                <td>
                                    <div class="table-td">
                                        <input type="text" placeholder="請輸入" id = "propertyType"/>
                                    </div>
                                </td>                   
                            </tr>
                            <tr>
                                <td>物業(yè)名稱</td>
                                <td>
                                    <div class="table-td">
                                        <input type="text" placeholder="請輸入" id = "propertyName"/>
                                    </div>
                                </td>                   
                            </tr>
                            <tr>
                                <td>物業(yè)地址</td>
                                <td>
                                    <div class="table-td">
                                        <input type="text" placeholder="請輸入" id = "propertyAddress"/>
                                    </div>
                                </td>                   
                            </tr>
                            <tr>
                                <td>面積</td>
                                <td>
                                    <div class="table-td">
                                        <input type="text" placeholder="請輸入" id = "propertyArea"/>
                                    </div> 
                                </td>                   
                            </tr>
                            <tr>
                                <td>購入日期</td>
                                <td>
                                    <div class="table-td">
                                        <input type="text" placeholder="請輸入" id = "propertyPurchaseDate"/>
                                   </div>
                                </td>               
                            </tr>
                            <tr>
                                <td>購買價(jià)</td>
                                <td>
                                    <div class="table-td">
                                        <input type="number" placeholder="請輸入" id = "propertyPurchasePrice"/>
                                    </div> 
                                </td>                   
                            </tr>
                            <tr>
                                <td>評估價(jià)</td>
                                <td>
                                     <div class="table-td">
                                        <input type="number" placeholder="請輸入" id = "propertyEvaluatePrice"/>
                                    </div>
                                </td>                   
                            </tr>
                            <tr>
                                <td>抵質(zhì)押门坷、借款情況</td>
                                <td>
                                    <div class="table-td">
                                        <input type="text" placeholder="請輸入" id = "propertyPledge"/>
                                    </div>
                                </td>                   
                            </tr>
                            
                        </table>
                        <button type="button" id="submit">保存</button>
                        
                    </div>

                </div>
               
                <div class="car">
                <!--//  車產(chǎn)信息-->
                    <div class="">  
                        車產(chǎn)
                        <span class="add-car"><i class="add-info cancel"></i><i class="change-cont">添加</i></span>                       
                    </div>
                    <div class="table-car" id="carProperty">
                        <table border="1" class="car-info">
                            <tr>
                                <td>品牌</td>
                                <td>
                                    <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "carBrand"/>
                                </div>
                                </td>
                            </tr>
                            <tr>
                                <td>型號</td>
                                <td>
                                    <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "carModel"/>
                                </div>
                                </td>                   
                            </tr>
                            <tr>
                                <td>車牌號</td>
                                <td>
                                    <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "carLicensePlate"/>
                                </div>
                                </td>                   
                            </tr>
                            <tr>
                                <td>發(fā)動機(jī)號</td>
                                <td>
                                    <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "carEngineNum"/>
                                </div>
                                </td>                   
                            </tr>
                            <tr>
                                <td>車架號</td>
                                <td>
                                    <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "carChassisNum"/>
                                </div>
                                </td>               
                            </tr>
                            <tr>
                                <td>購入日期</td>
                                <td>
                                     <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "carPurchaseDate"/>
                                </div>
                                </td>                   
                            </tr>
                            <tr>
                                <td>購買價(jià)</td>
                                <td>
                                    <div class="table-td">
                                    <input type="number" placeholder="請輸入" id = "carPurchasePrice"/>
                                </div>
                                </td>                   
                            </tr>
                            <tr>
                                <td>評估價(jià)</td>
                                <td>
                                    <div class="table-td">
                                    <input type="number" placeholder="請輸入" id = "carEvaluatePrice"/>
                                </div>
                                </td>                   
                            </tr>
                            <tr>
                                <td>抵質(zhì)押秸弛、借款情況</td>
                                <td>
                                    <div class="table-td">
                                    <input type="text" placeholder="請輸入" id = "carPledge"/>
                                </div>
                                </td>                   
                            </tr>
        
                        </table>
                        <button type="button" id="submit">保存</button>
                        
                    </div>

                </div>       
                                                      
            </div> 
            
            
        </div>
        <div >          
            <div >      
                <input type="button" id="prev" value="<<上一頁"/>                  
                <button type="button" id="next">下一頁>></button>
            </div>
        </div> 
                    
        <br/>
        <br/>
    </div>
    <!-- /.container-fluid -->
</div>
    <!-- /#page-wrapper -->
</div>
<!-- /#wrapper -->

</body>
<!--<%@include file="/page/common/foot.jsp" %>-->

<!--<script src="${pageContext.request.contextPath}/resources/js/loanproject/bossinfo.js" type="text/javascript" charset="utf-8"></script>-->
<script src="../../resources/js/loanproject/bossinfo.js" type="text/javascript" charset="utf-8"></script>
<script src="../../resources/js/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script>   
<script>
$(document).ready(function(){
    
    init();
    
    //給新表單中所有的input標(biāo)簽的id加上數(shù)字
    var completeId = 1; 
    var houseId = 1;
    var carId = 1;
    var houseCount = 1;
    var basicCount = 1;
    var carCount = 1;
        //添加基本信息表單
    $('span.add-basic').click(function(){
        var basicIdName = "complete-info"+completeId;
        $(".contain-table").append($(".complete-info").eq(0).clone().attr('id',basicIdName));   
        $('#'+basicIdName+' input').val('');            
        $('#'+basicIdName+' input').each(function(){
            var inputId = $(this).attr('id')+basicCount;
            $(this).attr('id',inputId);         
        })  
        basicCount += 1;
        completeId += 1;            
    })  
        //添加房產(chǎn)信息表單
    $('span.add-house').click(function(){           
        var houseIdName = "house-info"+houseId;         
        $(".house").append($(".table-house").eq(0).clone().attr('id',houseIdName)); 
        $('#'+houseIdName+' input').val('');            
        $('#'+houseIdName+' input').each(function(){
            var houseInputId = $(this).attr('id')+houseCount;                                   
            $(this).attr('id',houseInputId);                
        })  
        houseCount += 1;
        houseId += 1;
    })      
        //添加車產(chǎn)信息表單
    $('span.add-car').click(function(){         
        var carIdName = "house-info"+carId;         
        $(".car").append($(".table-car").eq(0).clone().attr('id',carIdName));   
        $('#'+carIdName+' input').val('');          
        $('#'+carIdName+' input').each(function(){
            var carInputId = $(this).attr('id')+carCount;                                   
            $(this).attr('id',carInputId);              
        })  
        carCount += 1;
        carId += 1;         
    })
    
    $('span.add-car').click(function(){         
        var carIdName = "house-info"+carId;         
        $(".car").append($(".table-car").eq(0).clone().attr('id',carIdName));   
        $('#'+carIdName+' input').val('');          
        $('#'+carIdName+' input').each(function(){
            var carInputId = $(this).attr('id')+carCount;                                   
            $(this).attr('id',carInputId);              
        })  
        carCount += 1;
        carId += 1;         
    })
    console.log($("input[type='radio']").length);

  });
    
</script>

</html>

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末澡谭,一起剝皮案震驚了整個(gè)濱河市杆兵,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖受神,帶你破解...
    沈念sama閱讀 222,252評論 6 516
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異,居然都是意外死亡廉嚼,警方通過查閱死者的電腦和手機(jī)杜跷,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,886評論 3 399
  • 文/潘曉璐 我一進(jìn)店門阳仔,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事果录。” “怎么了?”我有些...
    開封第一講書人閱讀 168,814評論 0 361
  • 文/不壞的土叔 我叫張陵椅棺,是天一觀的道長诱渤。 經(jīng)常有香客問我赡茸,道長赊锚,這世上最難降的妖魔是什么治筒? 我笑而不...
    開封第一講書人閱讀 59,869評論 1 299
  • 正文 為了忘掉前任屉栓,我火速辦了婚禮,結(jié)果婚禮上耸袜,老公的妹妹穿的比我還像新娘友多。我一直安慰自己,他們只是感情好堤框,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,888評論 6 398
  • 文/花漫 我一把揭開白布域滥。 她就那樣靜靜地躺著,像睡著了一般蜈抓。 火紅的嫁衣襯著肌膚如雪启绰。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,475評論 1 312
  • 那天沟使,我揣著相機(jī)與錄音委可,去河邊找鬼。 笑死腊嗡,一個(gè)胖子當(dāng)著我的面吹牛着倾,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播燕少,決...
    沈念sama閱讀 41,010評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼卡者,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了客们?” 一聲冷哼從身側(cè)響起崇决,我...
    開封第一講書人閱讀 39,924評論 0 277
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎底挫,沒想到半個(gè)月后恒傻,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,469評論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡凄敢,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,552評論 3 342
  • 正文 我和宋清朗相戀三年碌冶,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片涝缝。...
    茶點(diǎn)故事閱讀 40,680評論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡扑庞,死狀恐怖譬重,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情罐氨,我是刑警寧澤臀规,帶...
    沈念sama閱讀 36,362評論 5 351
  • 正文 年R本政府宣布,位于F島的核電站栅隐,受9級特大地震影響塔嬉,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜租悄,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,037評論 3 335
  • 文/蒙蒙 一谨究、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧泣棋,春花似錦胶哲、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,519評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至把敢,卻和暖如春寄摆,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背修赞。 一陣腳步聲響...
    開封第一講書人閱讀 33,621評論 1 274
  • 我被黑心中介騙來泰國打工婶恼, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人榔组。 一個(gè)月前我還...
    沈念sama閱讀 49,099評論 3 378
  • 正文 我出身青樓熙尉,卻偏偏與公主長得像,于是被迫代替她去往敵國和親搓扯。 傳聞我的和親對象是個(gè)殘疾皇子检痰,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,691評論 2 361

推薦閱讀更多精彩內(nèi)容