jQuery 函数在模态中不工作

Question

我正在使用 ID="sizesModal" 的 Foundation reveal modal，其中包含用户输入，当使用 "save" 按钮 [=15] 提交时，这些输入应该在尺寸和数量预览下预览=]

页脚中有一个名为 updateSizes 的函数

 function updateSizes() {
 var sizeString = '';
 for (var i=1;i<=12;i++){
  if(jQuery('#size'+i).val() != ''){
    sizeString +=  jQuery('#size'+i).val()+':'+jQuery('#qty'+i).val()+',';
      }
  }
  jQuery('#sizes').val(sizeString);
}

在 products.php 上的显示模式 div 中，有一个提交按钮

 </button>
 <button class="button" data-toggle="modal" data-target="#sizesModal" click="updateSizes();jQuery('#sizesModal').modal('toggle');return false;"> Save Changes
 </button>

我没有收到任何控制台消息，但按钮没有向其中输出任何内容 Sizes & Qty Preview

我已经包含了基础和页脚页面的所有脚本

Answer 1

我认为您必须检查是否执行了 if 语句。我认为 .Val() return 可能有其他东西。

Answer 2

我通过将 id 应用于按钮 "saveChangesSizes" 找到了解决方案，而不是在产品页面中以这种方式编写脚本

$("#saveChangesSizes").click(function(){
console.log("1");
var velicine="";
var niz=new Array();
for(var i=1; i<=12;i++){
    if($("#size_" + i).val()!=""){
        niz.push({size: $("#size_" + i).val(), qty: $("#qty_" + i).val()});
        velicine+=$("#size_" + i).val() + ":" + $("#qty_" + i).val() + ",";
    }
}
console.log(niz);
if(velicine.length>0){
    velicine=velicine.substring(0,velicine.length-1);
}
$("#qtyandsizes").val(JSON.stringify(niz));

$("#size").val(velicine);
 $("#sizesModal").foundation("close");
 return false;
});

jQuery 函数在模态中不工作

jQuery function not working inside a modal

jquery

zurb-foundation

zurb-foundation-6