溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

表單處理之添加刪除表單行

發(fā)布時(shí)間：2020-07-09 15:15:29 來(lái)源：網(wǎng)絡(luò) 閱讀：531 作者：027ryan 欄目：開(kāi)發(fā)技術(shù)

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

</head>

<body>

    <div id="search_conditions">

        <div class="condition">

         <a onclick="AddCondition(this,'#search_conditions')">+</a>

         <input />

        </div>

    </div>


    <script src="js/jquery-1.8.2.min.js"></script>

    <script>

        function AddCondition(ths,container){

            //ths 這里指<a></a>標(biāo)簽

          var cp = $(ths).parent().clone();

            //克隆標(biāo)簽<a></a>父標(biāo)簽并賦給變量cp

            cp.children(':first').text('-').attr('onclick',"RemoveCondition(this,'#search_conditions')");

            //獲取父標(biāo)簽第一個(gè)孩子a標(biāo)簽中的內(nèi)容然后通過(guò)text將內(nèi)容修改為'-',

            //接著通過(guò)attr修改onclick綁定的函數(shù)AddCondition為RemoveCondition


            $('#search_conditions').append(cp);

            //將克隆后的結(jié)果cp追加到父標(biāo)簽中

            //cp.appendTo('#search_conditions')

        }


        function RemoveCondition(ths,container){

            //ths形參代表標(biāo)簽<a></a>，所以標(biāo)簽a的父標(biāo)簽為<div class="condition"></div>，

            //然后刪除整個(gè)父標(biāo)簽從而實(shí)現(xiàn)刪除整個(gè)表單的功能

            $(ths).parent().remove();


        }

    </script>

</body>

</html>

演示效果:

表單處理之添加刪除表單行

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手