Js代碼中的span拼接問(wèn)題解決
這篇文章主要介紹了Js代碼中的span拼接問(wèn)題解決,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
今天遇到一個(gè)小需求，用bootstrap的table只有兩個(gè)字段，占用太寬，頁(yè)面不美觀，組長(zhǎng)要求用拼接，一行幾列的形式展現(xiàn)出來(lái)。
我在form表單中拼接了span，遇到以下問(wèn)題：
1.點(diǎn)擊查詢，以前生成的span不消失，新的拼接在后面
2.span中的復(fù)選框，值的取出，復(fù)選框的狀態(tài)更換
對(duì)于職場(chǎng)老手來(lái)說(shuō)，這沒(méi)什么，但是js代碼沒(méi)接觸多久的我來(lái)說(shuō)，只能撞墻尋出口，邊撞邊試。
我選擇的是遍歷form刪除，下面是代碼
$('span', form).each(function(){
$(this).remove();
});
/*這里的form，我換成了$("#"+id)*/
------》對(duì)與復(fù)選框的取值
1）.復(fù)選框若是value,直接$(this).val();若是自定義,則是$(this).attr("name");比如
$('input[class="checkbox"]:checked').each(function(){
/*對(duì)于選中復(fù)選框的value取值*/
$(this).val();
/*自定義取值*/$(this).attr("自定義的名字");
});
2).復(fù)選框的狀態(tài)
對(duì)于全選用prop,prop() 方法設(shè)置或返回被選元素的屬性和值。全選、取消全選的事件 使用prop可以避免版本迭代的bug，避免出現(xiàn)只能全選一次
function selectAll(){
if ($("input[name='ck']").prop("checked")) {
$("input[type='checkbox'][name='cks']").prop("checked",true);//全選
} else {
$("input[type='checkbox'][name='cks']").prop("checked",false); //取消全選
}
}
復(fù)選框就是根據(jù)checked的true或false改變狀態(tài)，在遍歷的選中復(fù)選框下，改變復(fù)選框?qū)ο髈bj.checked=false就改變了。
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
- js獲取html的span標(biāo)簽的值方法(超簡(jiǎn)單)
- javascript給span標(biāo)簽賦值的方法
- js動(dòng)態(tài)修改表格行colspan列跨度的方法
- JS 如果改變span標(biāo)簽的是否隱藏屬性
- JS 獲取span標(biāo)簽中的值的代碼 支持ie與firefox
- javascript 動(dòng)態(tài)table添加colspan\rowspan 參數(shù)的方法
- JScript|Event]面向事件驅(qū)動(dòng)的編程(二)--實(shí)例講解:將span模擬成超連接
- element-ui table span-method(行合并)的實(shí)現(xiàn)代碼
相關(guān)文章
這篇文章主要介紹了javascript實(shí)現(xiàn)在線客服效果的實(shí)例代碼，非常不錯(cuò)，這里推薦給大家，有需要的小伙伴可以參考下。2015-07-07
js實(shí)現(xiàn)canvas保存圖片為png格式并下載到本地的方法
本篇文章主要介紹了js實(shí)現(xiàn)canvas保存圖片為png格式并下載到本地的方法，非常具有實(shí)用價(jià)值，需要的朋友可以參考下2017-08-08
indexOf是在一個(gè)字符串中尋找一個(gè)字的位置，lastIndexOf 也是找字 , 它們倆的區(qū)別是前者從字符串頭開(kāi)始找，后者是從字符串末端開(kāi)始找2014-09-09
JS實(shí)現(xiàn)列表的響應(yīng)式排版(推薦)
列表的響應(yīng)式排版，首先每行固定好個(gè)數(shù)，然后隨頁(yè)面寬度調(diào)整個(gè)數(shù)和大小，保證圖片的的可讀性及美觀。接下來(lái)小編給大家?guī)?lái)實(shí)現(xiàn)思路介紹，一起看看吧2016-09-09
使用js判斷TextBox控件值改變?nèi)缓蟪霭l(fā)事件
這篇文章主要介紹了使用js判斷TextBox控件值改變?nèi)缓蟪霭l(fā)事件。需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2014-03-03
在知道的key的情況下遍歷map自然就跟數(shù)組一樣的訪問(wèn)羅，這里就不說(shuō)了，示例如下，感興趣的朋友可以參考下哈，希望對(duì)大家有所幫助2013-07-07
動(dòng)態(tài)修改DOM 里面的 id 屬性的弊端分析
我不知道是否有什么標(biāo)準(zhǔn)規(guī)定不允許修改id屬性，或者不建議修改id屬性，總之IE對(duì)此支持不佳。2008-09-09
js如何根據(jù)class獲取元素并且點(diǎn)擊元素詳解
這篇文章主要給大家介紹了關(guān)于js如何根據(jù)class獲取元素并且點(diǎn)擊元素的相關(guān)資料,獲取元素集合的方法有很多,文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下2025-04-04
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)簡(jiǎn)單日歷效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-05-05
這篇文章主要為大家詳細(xì)介紹了純js和css完成貪吃蛇小游戲，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-09-09