国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

開發(fā)時多選操作的實(shí)現(xiàn)

solocoder / 2887人閱讀

摘要：最近寫了一個工作室隨機(jī)出人為某部門干活的小源碼處理的過程中也學(xué)到了一個新技能多選操作主要是前端的實(shí)現(xiàn)這里就簡單記錄一下不過學(xué)長說我的代碼耦合性太強(qiáng)不宜于維護(hù)再加油吧首先是思路構(gòu)造思路往往比寫代碼更占據(jù)時間我首先想到的是那種點(diǎn)擊之后可以切換屬

最近寫了一個工作室隨機(jī)出人為某部門干活的小Demo 源碼
處理的過程中也學(xué)到了一個新技能:多選操作,主要是前端的實(shí)現(xiàn)
這里就簡單記錄一下
不過學(xué)長說我的代碼耦合性太強(qiáng),不宜于維護(hù).......再加油吧

首先是思路,構(gòu)造思路往往比寫代碼更占據(jù)時間
我首先想到的是那種點(diǎn)擊之后可以切換css屬性的前端樣式
然后就是切換的時候記錄對應(yīng)的所選ID,堆到數(shù)組并post給后端
動態(tài)css屬性 
全部都是JQ在帶節(jié)奏,強(qiáng)大啊

css屬性的改變就是在點(diǎn)擊之后,JQ選擇器固定標(biāo)簽,修改相應(yīng)的屬性
這里為了方便進(jìn)行選擇,我給每個button都賦予帶有特征的id
然后使用JQ中的.attr獲取相應(yīng)的class內(nèi)容
(具體的JQ的各種函數(shù)用法可以隨意的搜索到)

...


...
多選操作 
這里我加了一個提交名單的按鈕,然后再js函數(shù)中用id=0區(qū)別(數(shù)據(jù)庫中沒有id為0的數(shù)據(jù))
點(diǎn)擊之后將數(shù)組傳遞給后端
然后每次unchecked的改變都記錄在數(shù)組中
...


...

至于取消選中的操作則是數(shù)組的刪除固定元素
這里我找了一個網(wǎng)上的remove示例,直接加了進(jìn)去

//定義數(shù)組刪除元素
Array.prototype.remove = function(val) { 
    var index = this.indexOf(val); 
    if (index > -1) { 
        this.splice(index, 1); 
    } 
};

后記

這里在實(shí)行的過程中,我是受到前面刪除確認(rèn)的影響
在多選操作里面也是用下面這樣的操作,和長航學(xué)長找bug找了好久....

由于在button屬性里使用了onclick,而刪除操作里,模態(tài)框的確是還有一個確定按鈕,確實(shí)點(diǎn)擊了兩次
但是在多選操作里面再直接照搬使用,這里只有一個按鈕,就出現(xiàn)了點(diǎn)擊兩次才會執(zhí)行css動態(tài)執(zhí)行的效果
$("#clickConfirm").click(function () {
        parent.window.location="delete/"+id;
    });

這里也證明了一次,onclick和$().click();都會各自捕捉到一次click操作
這是想起來以為大牛說的話:不求甚解是阻礙部分人進(jìn)步的主要原因

爭取做一個Problem Solver而不是Language User吧

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/51490.html

相關(guān)文章

  • 開發(fā)時多選操作的實(shí)現(xiàn)

    摘要：最近寫了一個工作室隨機(jī)出人為某部門干活的小源碼處理的過程中也學(xué)到了一個新技能多選操作主要是前端的實(shí)現(xiàn)這里就簡單記錄一下不過學(xué)長說我的代碼耦合性太強(qiáng)不宜于維護(hù)再加油吧首先是思路構(gòu)造思路往往比寫代碼更占據(jù)時間我首先想到的是那種點(diǎn)擊之后可以切換屬 最近寫了一個工作室隨機(jī)出人為某部門干活的小Demo 源碼處理的過程中也學(xué)到了一個新技能:多選操作,主要是前端的實(shí)現(xiàn)這里就簡單記錄一下不過學(xué)長說我的...

    Coly 評論0 收藏0

  • Day10 - JS 實(shí)現(xiàn) Checkbox 中按住 Shift 的多選功能

    摘要：實(shí)現(xiàn)中按住的多選功能微信公眾號開發(fā)企業(yè)級產(chǎn)品全棧開發(fā)速成周末班首期班號正式開班，歡迎搶座作者簡介是推出的一個天挑戰(zhàn)。同時，將所有標(biāo)記為的項(xiàng)設(shè)置為選中。此外，對于取消選中，無法批量操作。 Day10 - JS 實(shí)現(xiàn) Checkbox 中按住 Shift 的多選功能 (Node+Vue+微信公眾號開發(fā))企業(yè)級產(chǎn)品全棧開發(fā)速成周末班首期班(10.28號正式開班，歡迎搶座) 作者：?liyue...

    U2FsdGVkX1x 評論0 收藏0

  • vue實(shí)現(xiàn)單選多選反選全選全不選

    摘要：多選如果已經(jīng)選中了，那就取消選中，如果沒有，則選中接下來我們寫一下全選，全取消，反選的實(shí)現(xiàn)。 單選 當(dāng)我們用v-for渲染一組數(shù)據(jù)的時候，我們可以帶上index以便區(qū)分他們我們這里利用這個index來簡單地實(shí)現(xiàn)單選 {{item}} 首選定義一個selectedNum,當(dāng)我們點(diǎn)擊item時，便把這個selectedNum更改為我們所點(diǎn)擊的item的index，然后每個item上加入判...

    劉福 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<