使用.data（）来设置变量

问题描述：

我想在使用.data（）的表单中设置一个变量并且无法让它工作，因为我无法获得变量“费用”的任何输出，我只能看到空白。理想情况下，用户将选择一种类型，输入一个素材，然后选择25％或50％。每个百分比与所选类型（hp或lp）的不同数据条目相关联。然后，所选的数据类型将被插入data（）选择器以提取“费用”值。我可以得到所有其他变量来显示一个数量，所以我认为这一定是我出错的地方。我不知道我做错了什么，所以任何输入将不胜感激！谢谢！使用.data（）来设置变量

这里是的jsfiddle - http://jsfiddle.net/gv0029/g78bG/2/

HTML：

<select class="pSelectP" id="pPost_D"> 
    <option value="select">Type</option> 
    <option data-hp="5" data-lp="2" value="Type 1">Type 1</option> 
</select> 
<br/> 
<input id="pPost_F" class="pSelectQ" placeholder="Footage" /> 
<br/> 
<select id="pPost_P" placeholder="Percentage"> 
    <option value="lp">25%</option> 
    <option value="hp">50%</option> 
</select> 
<br/> 
<input id="pPost_C" placeholder="Cost" /> 
<br/> 
<input id="pPost_A" placeholder="Total" />

JS：

$(document.body).on('keypress keydown keyup change', '[class="pSelectP"] , [class="pSelectQ"]', function() { 
    if ($('#manualOverrideNo').prop('checked')) { 
     var parts = $(this).attr('id').split("_"), 
      service = parts[0], 

      footage = parseFloat($("#" + service + "_F").val(), 
           10), 
      percentage = $("#" + service + "_P").val(), 
      fee = parseFloat($("#" + service + "_D").data("'" + 
        percentage + "'"), 10), 
      cost = $("#" + service + "_C"), 


      amount = '', 
      finalAmount = ''; 


     if (isNaN(footage)) { 
      total.val("Please enter Quantity"); 
     } 

     if (!isNaN(footage) && (!isNaN(Number(fee)))) { 
      amount = Math.ceil(footage * fee); 
      total.val(amount); 
      cost.val(fee); 
     } 


    } 

});

您缺少一个名为“manualOverrideNo”的元素。另外，parseFloat不需要2个参数 – HapiDjus

Doh。当我制作JSFiddle时，我忘记取出manualOverrideNo，但这不是问题。谢谢你指出，虽然。我有这样的印象，parseFloat应该与第二个参数一起使用来设置要使用的基数？那是我被告知的，以及我一直如何使用它的，尽管我没有这么做很久。 – mario

parseInt可以采取第二个参数。 http://www.w3schools.com/jsref/jsref_parseint.asp – HapiDjus

答

您可能需要调整一些数学的，但我认为这会为你工作。

$(document.body).on('keypress keydown keyup change', '[class="pSelectP"] , [class="pSelectQ"]', function() { 
      var service = $(this).attr('id').split("_")[0], 
       footage = parseFloat($("#" + service + "_F").val()); 
       pricetype = $("#" + service + "_P option:selected").val(); 
       percentage = parseFloat($('#pPost_D option:selected').data()[pricetype]); 
       fee = percentage * footage; 

      if (isNaN(footage)) { 
       $("#" + service + "_A").val("Please enter Quantity"); 
      } 

      if (!isNaN(footage) && (!isNaN(Number(fee)))) { 
       $("#" + service + "_A").val(Math.ceil(fee)); 
       $("#" + service + "_C").val(fee); 
      } 
    });

谢谢！我甚至没有考虑通过这条路线进行。我会检查这个并回复你。再次感谢！ – mario

我试了一下代码，但是这是按照实际百分比来代替与百分比相关的价格的多个素材。列出的百分比几乎与实际价格无关（这是一个奇怪的设置，我知道，但这就是他们喜欢它的原因）。我需要将素材数量乘以与每项服务相关的低价（“lp”，本例中为2）或高价（本例中为“hp”）。我可以在每个价格中硬编码，但大约有一百个，价格每个季度都在变化，所以我试图更聪明地工作，而不是更努力地哈哈大笑。但是，谢谢。 – mario

我已经更新了将从pPost_D select中选取数据值的代码。看看更好的适合您的需求。奇怪的是$（'＃select option：selected'）。data（'data-foo'）不会提取任何东西。 – HapiDjus

使用.data（）来设置变量

相关推荐