添加和刪除隱藏字段數組中的值，但未提交表單

我試圖在不提交表單的情況下操作隱藏字段的值。我發現的最接近的是Add and Remove values in a hidden field array 添加和刪除隱藏字段數組中的值，但未提交表單

問題我與此同時它提交表單。在我的項目中，我還沒有準備好提交表格。還有更多的問題需要問。 Here's a JSFiddle of my problem。

我覺得我錯過了像'返回假'的東西。

感謝您的幫助。

jQuery.fn.extend({ 
addToArray: function(value) { 
    return this.filter(":input").val(function(i, v) { 
     var arr = v.split(','); 
     arr.push(value); 
     return arr.join(','); 
    }).end(); 
}, 
removeFromArray: function(value) { 
    return this.filter(":input").val(function(i, v) { 
     return $.grep(v.split(','), function(val) { 
       return val != value; 
       }).join(','); 
    }).end(); 
} 
});

來源

2016-05-15 FlyingDog

你可以在onclick代碼添加return false;：

<button onclick='$("#myField").addToArray("21"); return false;'>

爲了防止提交。

我想你應該問一個單獨的問題，但我無論如何都會潛入這個問題。我修改了HTML in the jFiddle。由於您使用的是jQuery，我利用了click事件處理程序。最初，我創建了一個處理程序來查看需要什麼代碼。它看起來像最初這樣：

$("#strength").click(function() { 
    event.preventDefault(); 
    if ($('#goals').val().indexOf(',strength') >= 0) { 
    $('#goals').val($('#goals').val().replace(',strength', '')); 
    $(this).removeClass('button'); 
    $(this).addClass('buttonSelected'); 
    } else { 
    $('#goals').val($('#goals').val() + ',strength'); 
    $(this).removeClass('buttonSelected'); 
    $(this).addClass('button'); 
    } 
});

這是一個好的起點找出所需的代碼。但是我不想重複每個按鈕的代碼。所以我將我知道的代碼作爲其他按鈕的代碼進行了分解。因此，它是這樣的：

$("#strength").click(function() { 
    event.preventDefault(); 
    toggle(',strength', this); 
}); 

function toggle(str, thisObj) { 
    if ($('#goals').val().indexOf(str) >= 0) { 
    console.log(str + ' is already selected'); 
    $('#goals').val($('#goals').val().replace(str, '')); 
    $(thisObj).removeClass('buttonSelected'); 
    $(thisObj).addClass('button'); 
    } else { 
    console.log(str + ' is about to be selected'); 
    $('#goals').val($('#goals').val() + str); 
    $(thisObj).removeClass('button'); 
    $(thisObj).addClass('buttonSelected'); 
    } 
}

然後，它是非常簡單的用一些重複的代碼來處理額外的按鈕：

$("#weight").click(function() { 
    event.preventDefault(); 
    toggle(',weight', this); 
}); 

$("#tone").click(function() { 
    event.preventDefault(); 
    toggle(',tone', this); 
});

您可以減少重複，但我累了飢餓。希望這可以幫助你！

來源

2016-05-16 02:11:02 user212514

我想也將應用的CSS類更改爲按鈕。 [New Fiddle]（http://jsfiddle.net/FlyingDog/yo49c9ko/）此前，CSS開關正在工作，但不再是。建議？我只需要獲取數組中選定的值，並反映它們是否未選中，然後從數組中移除。我試着將addToArray的trogger添加到我現有的toggleClass中，但失敗了。 – FlyingDog

解決方法是防止默認事件。

這裏的解決方案：

  event.preventDefault();

http://jsfiddle.net/4kbq0veq/

來源

2016-05-15 22:00:35 Rikin

我正在嘗試將應用的CSS類更改爲按鈕。 [New Fiddle]（http://jsfiddle.net/FlyingDog/yo49c9ko/）此前，CSS開關正在工作，但不再是。建議？我只需要獲取數組中選定的值，並反映它們是否未選中，然後從數組中移除。我試着將addToArray的trogger添加到我現有的toggleClass中，但失敗了。 – FlyingDog

你可能想爲這樣的按鈕添加單獨的監聽器：'jQuery（「button」）。click（function（）{$（this）.toggleClass（「buttonSelected」）;}）;' – Rikin

添加和刪除隱藏字段數組中的值，但未提交表單

回答

相關問題