您好,登錄后才能下訂單哦!
這篇文章主要介紹“jQuery怎么實現(xiàn)動態(tài)添加標(biāo)簽事件”,在日常操作中,相信很多人在jQuery怎么實現(xiàn)動態(tài)添加標(biāo)簽事件問題上存在疑惑,小編查閱了各式資料,整理出簡單好用的操作方法,希望對大家解答”jQuery怎么實現(xiàn)動態(tài)添加標(biāo)簽事件”的疑惑有所幫助!接下來,請跟著小編一起來學(xué)習(xí)吧!
本文實例為大家分享了jQuery實現(xiàn)動態(tài)添加標(biāo)簽事件的具體代碼,供大家參考,具體內(nèi)容如下
代碼:
<body> <table id="tableID" border="1" align="center" width="60%"> <tr> <th>用戶名</th> <th>密碼</th> <th>操作</th> </tr> <tbody id="tbodyID"></tbody> </table> <hr /> 用戶名: <input type="text" id="usernameID" /> 密碼: <input type="text" id="passwordID" /> <input type="button" value="增加" id="addID" /> </body> <script type="text/javascript"> //定位"增加"按鈕,同時添加單擊事件 $("#addID").click(function() { //獲取用戶名和密碼的值 var username = $("#usernameID").val(); var password = $("#passwordID").val(); //去掉二邊的空格 username = $.trim(username); password = $.trim(password); //如果用戶名或密碼沒有填 if (username.length == 0 || password.length == 0) { //提示用戶 alert("用戶名或密碼沒有填"); } else { //創(chuàng)建1個tr標(biāo)簽 var $tr = $("<tr></tr>"); //創(chuàng)建3個td標(biāo)簽 var $td1 = $("<td>" + username + "</td>"); var $td2 = $("<td>" + password + "</td>"); var $td3 = $("<td></td>"); //創(chuàng)建input標(biāo)簽,設(shè)置為刪除按鈕 var $del = $("<input type='button' value='刪除'>"); //為刪除按鈕動態(tài)添加單擊事件 $del.click(function() { //刪除按鈕所有的行,即$tr對象 $tr.remove(); }); //將刪除按鈕添加到td3標(biāo)簽中 $td3.append($del); //將3個td標(biāo)簽依次添加到tr標(biāo)簽中 $tr.append($td1); $tr.append($td2); $tr.append($td3); //將tr標(biāo)簽添加到tbody標(biāo)簽中 $("#tbodyID").append($tr); //清空用戶名和密碼文本框中的內(nèi)容 $("#usernameID").val(""); $("#passwordID").val(""); } }); </script>
到此,關(guān)于“jQuery怎么實現(xiàn)動態(tài)添加標(biāo)簽事件”的學(xué)習(xí)就結(jié)束了,希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學(xué)習(xí),快去試試吧!若想繼續(xù)學(xué)習(xí)更多相關(guān)知識,請繼續(xù)關(guān)注億速云網(wǎng)站,小編會繼續(xù)努力為大家?guī)砀鄬嵱玫奈恼拢?/p>
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。