單擊按鈕將值存儲在JSON中

Question

我是JSON的新手，我正在嘗試使用JSON保存數據。 當我們單擊按鈕時，我有一個帶有一些按鈕的元素列表，我希望將按鈕的相應值保存在JSON中。 我還想比較JSON中已經存在的標題。

Here演示

Answer 1

您可以簡單地使用for循環來檢查具有該標題的元素是否已經存在：

function alreadyAdded(itemTitle) {
    for (var i = 0; i < objArray.length; i++) {
        if (objArray[i].title === itemTitle) {
            return true;
        }
    }
    return false;
};

另外，您不使用json對象，而只是使用JavaScript數組。

演示

Answer 2

我假設您想將值存儲在數組中，並且在單擊按鈕期間要檢查數組中是否已存在該項目。 如果是這樣，則可以使用以下代碼-

var counter = 0;
var jsonObj = []; //declare object 

$('.imgbtn').click(function () {
    var title = $(this).parent().parent().find('span').html();
    var image = $(this).parent().parent().find('img').prop('src');
    var match = $.grep(jsonObj, function (e) { 
        return e.title == title; 
    });

    if (match.length > 0) {
        // This title already exists in the object.
        // Do whatever you want. I am simply returning.
        return;
    }

    counter++;
    $('#lblCart').html(counter);
    jsonObj.push({
        id: counter,
        title: title,
        image: image,
        description: 'Example'
    });
});

注意，我已經在回調函數之外聲明了數組。 這樣可以確保所有對回調的調用都在同一個數組對象上進行。 在回調內部聲明它只是使其可用於單個回調調用。

另請注意，您只是在使用數組來存儲純JavaScript對象。

演示

Answer 3

試試這個http://jsfiddle.net/Z3v4g/

var counter = 0;
var jsonObj = []; //declare object

    $('.imgbtn').click(function () {

        var title = $(this).parent().parent().find('span').html();
        var image = $(this).parent().parent().find('img').prop('src');

        for( var i=0; i<jsonObj.length; i++){
           if( jsonObj[i].title == title ) return false;
        };

        counter++;
        $('#lblCart').html(counter);

        jsonObj.push({
           id: counter,
           title: title,
           image: image,
           description: 'Example'
           });
        });

Answer 4

第一：

var jsonObj = []; //declare object

這不是JSON。 這是一個數組。 JSON只是Javascript對象的表示法。 要聲明一個對象，您應該執行以下操作：

var jsonObj = {};

要么：

var jsonObj = new Object();

之后，您可以執行以下操作：

var counter = 0;
var jsonObj = new Object();

$('.imgbtn').click(function () {
   var title = $(this).parent().parent().find('span').html();
   var image = $(this).parent().parent().find('img').prop('src');    
   if (!(title in jsonObj)) { // if item is not in the object, (title in jsonObj) returns true of false
       jsonObj[title] = { // When you have hundreds of items, this approach is way faster then using FOR loop, and if you need to alter the item or get one value, you can just call it by name: jsonObj['ABC'].image will return the path of the image
           id: counter,
           image: image,
           description: 'Example'
       }
       counter++;
       $('#lblCart').html(counter);
   } else {
       // Do what you want if the item is already in the list
       alert('Item already in the list');
       console.log(jsonObj[title]);
   }
});

不要使用FOR循環來完成您不希望做的事情，如果計數器變高，只會減慢您的應用程序的速度。