Javascript 尝试使用HTML数据属性匹配来自两个数据库的数据

我有下面的代码，在一个页面上呈现一些产品。每个产品都共享相同的数据属性“数据项upc”。页面上还有一个为每个产品呈现的按钮（确切地说，总共有6个按钮）。它们都共享相同的数据项upc数据属性

我能够成功地获取数据属性的值，并将其与第二个数据库中具有相同UPC值的项相匹配。但由于某些原因，只有第一个按钮起作用并显示模式。不知道发生了什么事。希望有人能帮我，我会非常感激的

//declare variable to store JSON data
var product_data = {};
var nutritional_data = {};

$(document).ready(function() {

      'use strict';

      //grab product data
      $.ajax({
        dataType: "jsonp",
        url: 'path to URL',
        cache: true,
        success: function(data){
          //assign JSON to product data variable
          product_data = JSON.parse(JSON.stringify(data).replace(/"\s+|\s+"/g,'"'));

      //grab nutrional data   
      $.ajax({
        dataType: "jsonp",
        url: 'path to URL',
        cache: true,
        success: function(json){
          //assign JSON to product data variable
          nutritional_data = JSON.parse(JSON.stringify(json).replace(/"\s+|\s+"/g,'"'));

          //declare divs to store data
          var productDivOne = '';
          var productDivTwo = '';

          $.each(product_data, function(i, item) {
              //convert JSON strings to uppercase for comparison
              var brandLetter = item.itemBrandLetter.toUpperCase();
              var foodService = item.itemDeli.toUpperCase();
              var brandItem = item.itemName;

              if (brandLetter == "LB" && foodService == "N") {
                  if (brandItem.indexOf("Panettone") >= 0)  { 
                    productDivOne += 
                    '<div class="item col-xs-12 col-sm-4 col-md-4 col-lg-4">' +
                        '<div class="thumbnail">' + 
                            '<img class="scale-down-seperate-prods" src="' + item.imageURL + '" alt="' + item.itemName + '" />' +
                            '<div class="caption">' + '<br>' + 
                                '<h3 class="group inner list-group-item-heading">' + item.itemName + '</h3>' +
                                '<h4 class="group inner list-group-item-text">' + item.itemFullUPC.slice(1, -1) + ' • ' + item.itemPackSize.toLowerCase().substring(item.itemPackSize.lastIndexOf("/") + 1) + '</h4>' +
                                '<button type="button" class="btn btn-info btn-lg showNutritionFacts" data-item-upc="' + item.itemFullUPC + '" value="itemFullUPC">Nutrition Facts</button>' +    
                            '</div>' +
                        '</div>' +
                    '</div>';
                  }
                  if (brandItem.indexOf("Egg") >= 0)  { 
                    productDivTwo += 
                    '<div class="item col-xs-12 col-sm-4 col-md-4 col-lg-4">' +
                        '<div class="thumbnail">' + 
                            '<img class="scale-down-seperate-prods" src="' + item.imageURL + '" alt="' + item.itemName + '" />' +
                            '<div class="caption">' + '<br>' + 
                                '<h3 class="group inner list-group-item-heading">' + item.itemName + '</h3>' +
                                '<h4 class="group inner list-group-item-text">' + item.itemFullUPC.slice(1, -1) + ' • ' + item.itemPackSize.toLowerCase().substring(item.itemPackSize.lastIndexOf("/") + 1) + '</h4>' +
                                '<button type="button" class="btn btn-info btn-lg showNutritionFacts" data-item-upc="' + item.itemFullUPC + '" value="itemFullUPC">Nutrition Facts</button>' +    
                            '</div>' +
                        '</div>' +
                    '</div>';
                  }
              }
          });

          //show nutritional information on button click
          $("body").on('click', ".showNutritionFacts", function(event){

            //get passed data from other function
            var clickedItemUPC = $(this).data('item-upc');
            alert(clickedItemUPC);

            //declare variables to store data
            var servingSize = '';
            var servingPerContainer = '';
            var calories = '';
            var caloriesFat = '';
            var totalFatGrams = '';
            var totalFatPercentage = '';
            var saturatedFatGrams = '';
            var saturatedFatPercentage = '';
            var transFatGrams = '';
            var polyunsaturatedFatGrams = '';
            var monounsaturatedFatGrams = '';
            var cholesterolGrams = '';
            var cholesterolPercentage = '';
            var sodiumGrams = '';
            var sodiumPercentage = '';
            var totalCarbohydrateGrams = '';
            var totalCarbohydratePercentage = '';
            var dietaryFiberGrams = '';
            var dietaryFiberPercentage = '';
            var sugarGrams = '';
            var sugarGramsAdded = '';
            var sugarGramsAddedPercentage = '';
            var proteinGrams = '';
            var vitaminAPercentage = '';
            var vitaminCGrams = '';
            var vitaminCPercentage = '';
            var vitaminDGrams = '';
            var vitaminDPercentage = '';
            var calciumGrams = '';
            var calciumPercentage = '';
            var ironGrams = '';
            var ironPercentage = '';
            var potassiumGrams = '';
            var potassiumPercentage = '';
            var thiamineGrams = '';
            var thiaminePercentage = '';
            var riboflavinGrams = '';
            var riboflavinPercentage = '';
            var niacinGrams = '';
            var niacinPercentage = '';
            var ingredients = '';

                //comparison UPC variable
                var compareNutUPC;

                $.each(nutritional_data, function (i, item) {

                   //assign comparison UPC to itemNum
                   compareNutUPC = item.itemNum;

                   //compare product UPC in nutritional and product data
                   if (clickedItemUPC == compareNutUPC) {

                      servingSize += item.servingSize;
                      servingPerContainer += item.itemServings;
                      calories += item.itemCalories;
                      caloriesFat += item.itemCaloriesFromFat;
                      transFatGrams += item.itemTransFat + 'g';
                      polyunsaturatedFatGrams += item.itemPolyUnsatFat + 'g';
                      monounsaturatedFatGrams += item.itemMonoUnsatFat + 'g';
                      saturatedFatGrams += item.itemSaturFat + 'g';
                      saturatedFatPercentage += item.itemSaturFatPerc + '%';
                      totalFatGrams += item.itemTotalFat + 'g';
                      totalFatPercentage += item.itemTotalFatPerc + '%';
                      cholesterolGrams += item.itemCholesterol + 'mg';
                      cholesterolPercentage += item.itemCholesterolPerc + '%';
                      sodiumGrams += item.itemSodium + 'mg';
                      sodiumPercentage += item.itemSodiumPerc + '%';
                      totalCarbohydrateGrams += item.itemTotalCarb + 'g';
                      totalCarbohydratePercentage += item.itemTotalCarbPerc + '%';
                      sugarGrams += item.itemSugars + 'g';
                      sugarGramsAdded += item.itemSugarsAdded + 'g';
                      sugarGramsAddedPercentage += item.itemSugarsAddedPerc + '%';
                      dietaryFiberGrams += item.itemDietFiber + 'g';
                      dietaryFiberPercentage += item.itemDietFiberPerc + '%';
                      proteinGrams += item.itemProtein + 'g';
                      vitaminAPercentage += item.itemVitaminA + '%';
                      vitaminCPercentage += item.itemVitaminC + '%';
                      vitaminDGrams += item.itemVitaminDMeasure;
                      vitaminDPercentage += item.itemVitaminD + '%';
                      calciumGrams += item.itemCalciumMeasure;
                      calciumPercentage += item.itemCalcium + '%';
                      ironGrams += item.itemIronMeasure;
                      ironPercentage += item.itemIron + '%';
                      thiaminePercentage += item.itemThiamin + '%';
                      riboflavinPercentage += item.itemRiboflavin + '%';
                      niacinPercentage += item.itemNiacin + '%';
                      potassiumGrams += item.itemPotassium;
                      potassiumPercentage += item.itemPotassiumPerc + '%';
                      ingredients += item.itemIngredients;
                   } 
                });

                $(".servingSize").html(servingSize.replace(/\s+(?=g)/g, '').toLowerCase());
                $(".servingPerContainer").html(servingPerContainer);
                $(".calories").html(calories);
                $(".caloriesFat").html(caloriesFat);
                $(".transFatGrams").html(transFatGrams);
                $(".polyunsaturatedFatGrams").html(polyunsaturatedFatGrams);
                $(".monounsaturatedFatGrams").html(monounsaturatedFatGrams);
                $(".saturatedFatGrams").html(saturatedFatGrams);
                $(".saturatedFatPercentage").html(saturatedFatPercentage);
                $(".totalFatGrams").html(totalFatGrams);
                $(".totalFatPercentage").html(totalFatPercentage);
                $(".cholesterolGrams").html(cholesterolGrams);
                $(".cholesterolPercentage").html(cholesterolPercentage);
                $(".sodiumGrams").html(sodiumGrams);
                $(".sodiumPercentage").html(sodiumPercentage);
                $(".totalCarbohydrateGrams").html(totalCarbohydrateGrams);
                $(".totalCarbohydratePercentage").html(totalCarbohydratePercentage);
                $(".sugarGrams").html(sugarGrams);
                $(".sugarGramsAdded").html(sugarGramsAdded);
                $(".sugarGramsAddedPercentage").html(sugarGramsAddedPercentage);
                $(".dietaryFiberGrams").html(dietaryFiberGrams);
                $(".dietaryFiberPercentage").html(dietaryFiberPercentage);
                $(".proteinGrams").html(proteinGrams);
                $(".vitaminAPercentage").html(vitaminAPercentage);
                $(".vitaminCPercentage").html(vitaminCPercentage);
                $(".vitaminDGrams").html(vitaminDGrams);
                $(".vitaminDPercentage").html(vitaminDPercentage);
                $(".calciumGrams").html(calciumGrams);
                $(".calciumPercentage").html(calciumPercentage);
                $(".ironGrams").html(ironGrams);
                $(".ironPercentage").html(ironPercentage);
                $(".thiaminePercentage").html(thiaminePercentage);
                $(".riboflavinPercentage").html(riboflavinPercentage);
                $(".niacinPercentage").html(niacinPercentage);
                $(".potassiumGrams").html(potassiumGrams);
                $(".potassiumPercentage").html(potassiumPercentage);
                $(".ingredients").html(ingredients.toUpperCase());

                //determine which modal to show
                if ($('.vitaminDGrams:contains("mcg")').length > 0 && $('.calciumGrams:contains("mg")').length > 0 && $('.ironGrams:contains("mg")').length > 0) {
                    $('.nutritionPopupAlternate').modal('show');   
                } else if (servingSize == 0) {
                    $('.nutritionPopupNoInfo').modal('show');
                } else {
                    $('.nutritionPopupStandard').modal('show');
                }

          });

          //append to appropriate div
          $('#productDivOne').html(productDivOne);
          $('#productDivTwo').html(productDivTwo);

        }
      });
     //end of prod data
     }
   });
   //end of nut data
});  

//声明用于存储JSON数据的变量
var乘积_data={}；
var\u data={}；
$（文档）.ready（函数（）{
"严格使用",；
//获取产品数据
$.ajax({
数据类型：“jsonp”，
url:“url的路径”，
是的，
成功：功能（数据）{
//将JSON分配给产品数据变量
product_data=JSON.parse（JSON.stringify（data）.replace（/“\s+|\s+”/g，”）；
//获取营养数据
$.ajax({
数据类型：“jsonp”，
url:“url的路径”，
是的，
成功：函数（json）{
//将JSON分配给产品数据变量
营养数据=JSON.parse（JSON.stringify（JSON）.replace（/“\s+\s+”/g，”）；
//声明div以存储数据
var productDivOne=''；
var productDivTwo=''；
$。每个（产品数据、功能（i、项目）{
//将JSON字符串转换为大写进行比较
var brandLetter=item.itemBrandLetter.toUpperCase（）；
var foodService=item.itemDeli.toUpperCase（）；
var brandItem=item.itemName；
如果（brandLetter==“LB”&&foodService==“N”）{
如果（brandItem.indexOf（“Panettone”）>=0{
productDivOne+=
'' +
'' + 
'' +
“+”
“+
''+item.itemName+''项目+
“+item.itemFullUPC.slice（1，-1）+”•“+item.itemPackSize.toLowerCase（）子字符串（item.itemPackSize.lastIndexOf（“/”+1）+”+
“营养事实”+
'' +
'' +
'';
}
如果（brandItem.indexOf（“Egg”）>=0{
productDivTwo+=
'' +
'' + 
'' +
“+”
“+
''+item.itemName+''项目+
“+item.itemFullUPC.slice（1，-1）+”•“+item.itemPackSize.toLowerCase（）子字符串（item.itemPackSize.lastIndexOf（“/”+1）+”+
“营养事实”+
'' +
'' +
'';
}
}
});
//点击按钮显示营养信息
$（“body”）。在（'click'，.showNutritionFacts'，函数（事件）{
//从其他函数获取传递的数据
var clickedItemUPC=$（this）.data（'item-upc'）；
警报（单击编辑PC）；
//声明变量以存储数据
var servingSize=''；
var servingPerContainer=''；
var卡路里=“”；
var卡路里脂肪=“”；
var totalFatGrams=''；
var totalFatPercentage=''；
var饱和数据图=“”；
var saturatedFatPercentage=''；
变量转换图=“”；
var polyunsaturatedFatGrams=''；
var单不饱和脂肪图=“”；
胆甾醇谱=''；
胆甾醇含量=''；
var sodiumGrams=“”；
var sodiumPercentage=''；
var totalCarbohydrateGrams=''；
var总碳水化合物百分比=“”；
var dietaryFiberGrams=''；
var dietaryFiberPercentage=''；
var-sugarGrams=''；
var sugarGramsAdded=''；
var sugarGramsAddedPercentage=''；
变量proteinGrams=''；
维生素A百分比=''；
维生素cGrams=''；
维生素C含量=“”；
var vitaminDGrams=“”；
风险值百分比=“”；
变量钙谱=“”；
var Caciumpercentage=''；
var ironGrams=''；
var ironPercentage=''；
var钾盐克数=“”；
var钾盐百分比=“”；
变异硫胺素图=''；
维生素A百分比=“”；
var核黄素质谱=“”；
var核黄素百分比=“”；
var niacinGrams=''；
var niacinPercentage=''；
var成分=“”；
//比较UPC变量
var CompareNupC；
$。每个（营养组数据、功能（i、项目）{
//将比较UPC分配给itemNum
CompareNupC=item.itemNum；
//比较营养和产品数据中的产品UPC
如果（单击EditEmupc==CompareNupC）{
servingSize+=料件。servingSize；
servingPerContainer+=item.itemServings；
卡路里+=item.item卡路里；
卡路里脂肪+=项目。项目卡路里来自脂肪；
transFatGrams+=item.itemTransFat+'g'；
polyunsaturatedFatGrams+=item.itemPolyUnsatFat+'g'；
monounsaturatedFatGrams+=item.itemMonoUnsatFat+'g'；
饱和脂肪酸+=项目。项目饱和脂肪酸+'g'；
saturatedFatPercentage+=item.ItemSaturatedFatPerc+'%'；