從jQuery結果中刪除默認值使用正則表達式序列化

Question

我正在構建一個基於用戶在頁面上操作的單選按鈕組的哈希。爲確保只有相關信息包含在URL中，我想排除仍然設置爲默認值的字段。我覺得jQuery序列化和一點正則表達式會更有效率，而不是循環遍歷字段。 但是，此正則表達式會在結果散列中留下最後一個默認值。我試過的其他變體刪除了太多或太少的＆符號。任何人都可以提出一種模式，將字段設置爲默認值，而不管它們在哈希中的位置如何？

以下是HTML和JavaScript（帶正則表達式）的示例。有大約在整頁十幾切換組，他們將有標籤等

function action() { 
 
    console.log($('#formId').serialize().replace(/toggle(\d*)=default(&:?)/g, '')); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<form id="formId"> 
 
    <input type="radio" id="toggle4on" name="toggle4" value="on"> 
 
    <input type="radio" id="toggle4off" name="toggle4" value="off"> 
 
    <input type="radio" id="toggle4default" name="toggle4" value="default"> 
 
    <br> 
 
    <input type="radio" id="toggle5on" name="toggle5" value="on"> 
 
    <input type="radio" id="toggle5off" name="toggle5" value="off"> 
 
    <input type="radio" id="toggle5default" name="toggle5" value="default"> 
 
</form> 
 

 
<button onclick="action()">Show</button>

Answer 1

幾件事情，這將有助於在我看來。不要使用onclick=""，請使用jQuery。其次，你不必序列化的形式，可以序列輸入元左右的列表：

$(document).ready(function(){ 
 
\t $('.js-submit').on('click', function(){ 
 
    var $this = $(this); 
 
    console.log($this.closest("form").find("input:not(.js-default-value)").serialize()); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="formId"> 
 
    <input type="radio" id="toggle4on" name="toggle4" value="on"> 
 
    <input type="radio" id="toggle4off" name="toggle4" value="off"> 
 
    <input type="radio" id="toggle4default" name="toggle4" class="js-default-value" value="default"> 
 
    <br> 
 
    <input type="radio" id="toggle5on" name="toggle5" value="on"> 
 
    <input type="radio" id="toggle5off" name="toggle5" value="off"> 
 
    <input type="radio" id="toggle5default" name="toggle5" class="js-default-value" value="default"> 
 
    <button class="js-submit" type="button">Show</button> 
 
</form>

你必須，如果你打算使用修改find()其他類型的輸入（按鈕，textarea等），但代碼也可以通過應用默認類來排除這些。

Answer 2

而不是遍歷場我自己，我覺得jQuery的序列化和少量的定期表達會更有效率。

這不會更有效率。正則表達式非常昂貴且錯誤。我會建議循環使用jQuery的領域，並刪除不需要的值。

例子：

function isDefaultValue(elem) 
 
{ 
 
    return $(elem).val() == "default"; //skip if default value 
 
} 
 

 

 
function action() { 
 
    var value = $('#formId input').filter(function(index, el){ 
 
     return !isDefaultValue(el) 
 
    }).serialize(); 
 
    
 
    console.log(value); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<form id="formId"> 
 
    <input type="radio" id="toggle4on" name="toggle4" value="on"> 
 
    <input type="radio" id="toggle4off" name="toggle4" value="off"> 
 
    <input type="radio" id="toggle4default" name="toggle4" value="default"> 
 
    <br> 
 
    <input type="radio" id="toggle5on" name="toggle5" value="on"> 
 
    <input type="radio" id="toggle5off" name="toggle5" value="off"> 
 
    <input type="radio" id="toggle5default" name="toggle5" value="default"> 
 
</form> 
 

 
<button onclick="action()">Show</button>