Jquery 评估变量并转换为货币

Jquery eval variable and convert to currency

我有一个 jquery 应用程序,我需要根据 table 中存在的行数来评估表单中的变量。

期望的行为是找到产品的选定选项,提取值(然后对应于基于变量名称的预定义价格),然后对价格进行处理。我在评估变量名称、转换为数字,然后使用货币插件转换为货币时遇到问题。

这是表格:

    <table id="sizetable" class="table table-responsive table-condensed">
    <thead>
        <tr>
            <td width="30%">Shaft Type<input type="hidden" id="numfields" name="numfields" value="6"></td>
            <td width="25%">Team Message (Free)<br><small>Appears on every shaft - 24 character max</small></td>
            <td>&nbsp;</td>
            <td width="25%">Individual Message<br><small>+ each - 24 character max</small></td>
            <td>&nbsp;</td>
            <td width="10%">Shaft Price</td>
            <td width="10%"><button class="add_field_button btn btn-success">Add Shaft <span class="glyphicons glyphicons-circle-plus"></span></button></td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td><select name="toproduct1" id="toproduct1" class="toproduct">
                    <option value="28">Team Order Specialty Attack Shaft - .00</option>
                    <option value="29">Team Order Specialty Defense Shaft - .00</option>
                </select>
            </td>
            <td><input type="text" id="teammsg1" name="teammsg1" class="form-control" maxlength="24"></td>
                <td><span class="badge tmsgchr">0</span></td>
            <td><input type="text" id="indmsg1" name="indmsg1" class="form-control indmsg" maxlength="24"></td>
                <td><span class="badge indmsgchr1"></span></td>
            <td><span id="unitprice1"></span></td>
            <td><a class="remove_field btn btn-danger" disabled>Remove <span class="glyphicons glyphicons-circle-minus"></span></a></td>
        </tr>
        <tr>
            <td><select name="toproduct2" id="toproduct2" class="toproduct">
<option value="28">Team Order Specialty Attack Shaft - .00</option>
<option value="29">Team Order Specialty Defense Shaft - .00</option>
</select>
            </td>
            <td><span class="tmsg light-gray"></td>
                <td></td>
            <td><input type="text" id="indmsg2" name="indmsg2" class="form-control indmsg" maxlength="24"></td>
                <td><span class="badge indmsgchr2"></span></td>
            <td><span id="unitprice2"></span></td>
            <td><a class="remove_field btn btn-danger" disabled>Remove <span class="glyphicons glyphicons-circle-minus"></span></a></td>
        </tr>
...

我写的jquery如下:

$(document).ready(function() {  
    var max_fields      = 20; //maximum input boxes allowed
    var min_fields      = 6; //minimum input boxes allowed
    var wrapper         = $(".input_fields_wrap"); //Fields wrapper
    var add_button      = $(".add_field_button"); //Add button ID
    var ordertot        = 0;
    var indbrandcost    = 5;
    var shaftprice      = 0;

$(".toproduct, .indmsg").on('keyup keypress blur change paste cut', function(){
        var id28 = 25; //dynamically written based on item price
        var id29 = 50;

//loop through all fields, check if that row exists, then see which selection matches up with id28 or 1d29 above, then do something
        for(i = 1; i < max_fields; i++) { 
            if($('#toproduct'+i).val() != '') {
            var f = $('#toproduct'+i).find('option:selected').attr('value');
                if($('#indmsg'+i).val() != '') {
                    $('#unitprice'+i).text((eval('id'+f)+5).currency()); //getting error here
                    //var shaftprice = shaftprice + indbrandcost;
                }
                else {
                    $('#unitprice'+i).text((eval('id'+f)).currency()); // getting error here
                }
            }

        }

    });

您的代码中有几个错误。我创建了一个有效的代码笔:https://codepen.io/pahund/pen/xqpByN?editors=1011

相关代码:

$(".toproduct, .indmsg").on('keyup keypress blur change paste cut', function() {
    var id28 = 25; //dynamically written based on item price
    var id29 = 50;

    //loop through all fields, check if that row exists, then see which selection matches up with id28 or 1d29 above, then do something
    for (var i = 1; i < max_fields; i++) {
        var f = $('#toproduct' + i).val();
        if (f) {
            if ($('#indmsg' + i).val() !== '') {
                $('#unitprice' + i).text((eval('id' + f) + 5)); //getting error here
            } else {
                $('#unitprice' + i).text((eval('id' + f))); // getting error here
            }
        }
    }
});
  • 在你的查找中,在 I 之前添加了一个 var (否则你将创建一个全局变量 window.i
  • 使用 val() 获取下拉列表的值
  • 简单地检查是否定义了变量 f 而不是测试空字符串,否则您将尝试为不存在的元素创建一个值 topproduct3(这导致错误“Uncaught ReferenceError: idundefined”)
  • 从表达式中删除了 currency 插件,该插件将值添加到具有 $.text() 的范围 – 这个的结果表达式是一个字符串,你不能 运行 jQuery 插件
  • 使用 !== 而不是 !=(最佳实践,总是更喜欢 !== 和 === 而不是 != 和==)