如何從列表中刪除多餘的逗號

我有一個複選框列表，如果選中了一個複選框，我將複選框的值附加到頁面上其他位置的輸入字段。如果複選框未選中，我將從隱藏的輸入字段中刪除該值。發生了什麼是如果值被添加和刪除就好，但他們留下一系列的逗號後面複選框選中，未選中，選中，未選中等。如何從列表中刪除多餘的逗號

A）我應該擔心它
B）如果是的話，我應該如何改變我的添加/附加例程（見下文），或者有更好的方式去做我正在做的事情？我寧願最終得到一個乾淨的列表，如0_1,0_2,41_4反對0_1,,,,,,,,,,,,,,,,0_2,,,,41_4,,,,。

<input type="text" value="0_1,0_2,41_4" id="EOStatus_SelLayers" /> 

    // example of dataset: '0_1,0_2,41_4'; 
    if (xyz.hasClass("icon-check-empty")) { 
     var existing_str = $('#EOStatus_SelLayers').val(); 
      if (existing_str==null || existing_str==""){ 
       //add 
       $('#EOStatus_SelLayers').val(id); 
      } 
      else { 
       //append  
       $('#EOStatus_SelLayers').val(existing_str + ',' + id);     
      } 
    } 
    else { 
     $(xyz).removeClass("icon-check").addClass("icon-check-empty"); 
     var old_str = $('#EOStatus_SelLayers').val(); 
     var new_str = old_str.replace(','+id,''); 
     var new_str = old_str.replace(id,''); 
     $('#EOStatus_SelLayers').val(new_str); 
    }

else語句，我可以做這樣的事情：

var new_str = old_str.replace(id,''); 
var new_str = old_str.replace(',,',',');

來源

2014-03-07 HPWD

你可以用一個空字符串替換ID，然後更換任何無關的逗號。

有您可以用多餘的逗號結束了三個地方：

雙逗號中間的某個位置（需要用一個逗號來代替）
領先逗號（必須是刪除）
尾隨逗號（需要被移除）

可以解決所有三種情況下與這兩個替換操作：

.replace(/,,/g, ",").replace(/^,|,$/g, "");

哪個到位看起來是這樣的：

else { 
    $(xyz).removeClass("icon-check").addClass("icon-check-empty"); 
    var old_str = $('#EOStatus_SelLayers').val(); 
    var new_str = old_str.replace(id,'').replace(/,,/g, ",").replace(/^,|,$/g, ""); 
    $('#EOStatus_SelLayers').val(new_str); 
}

來源

2014-03-07 01:29:37 jfriend00

啊，我沒有想到領先或尾隨逗號。接得好。測試解決方案。 – HPWD

好的，那非常漂亮。我的新片段。如果說足夠的時間已經過去，那麼將會得到答案。 – HPWD

如果你正在使用jQuery - 一個簡單的方法是簡單的改變是由複選框每次重新設置的輸入值？簡單地連接每個ID：檢查輸入...如果您使用自定義庫來更改複選框的外觀，我確定存在允許以下工作的更改事件觸發器。

或者，您應該可以編輯以適應您的特定需求。

$('input[type=checkbox]').on('change', function(e) { 
    var newVal = []; 

    $('input[type=checkbox]:checked').each(function() { 
     newVal.push($(this).attr('id')); 
    }); 

    $('#EOStatus_SelLayers').val(newVal.join(',')); 
});

或者，在情況下，你使用的圖像：

$('[class^="icon-check"]').on('click', function(e) { 
    var newVal = []; 

    $('.icon-check').each(function() { 
     newVal.push($(this).attr('id')); 
    }); 

    $(this).toggleClass('icon-check-empty'); 
    $(this).toggleClass('icon-check'); 

    $('#EOStatus_SelLayers').val(newVal.join(',')); 
});

免責聲明：沒有測試 - 但看起來像它應該工作。

來源

2014-03-07 01:36:41

我沒有真正使用複選框，我使用的圖像看起來像一個更大的複選框（它的大小更容易讓我的客戶直觀地看到它）。否則，您的解決方案看起來不錯。我會在完成我的項目時嘗試。我是新來的，所以它看起來很有趣。 – HPWD

陣列推送是一種ecmascript3標準，可以與任何常用瀏覽器一起工作在IE5.5 +中。更多信息在這裏https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push。我已經編輯了上面的示例，介紹如何使用圖像。免責聲明：未經測試 - 但看起來應該工作。 –

+1知道'ecmascript3'：D – HPWD

如何從列表中刪除多餘的逗號

回答

相關問題