Question

在多次尝试之后，我无法更新函数外部和函数内部的值。问题是函数内部的变量值不能在函数外部访问，并且无法更新函数内部的变量值。我JSFIDDLE就在这里。

我的代码在这里：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

<body>
<table class="invtable table table-bordered table-hover" >
        <thead>
            <tr>

                <th class="col-md-1" >No.</th>

                <th class="col-md-2">ProductName</th>
                <th class="col-md-2">Qty</th>
                <th class="col-md-2">Price</th>
                <th class="col-md-2">PDis</th>
                <th class="col-md-2">TDis</th>
                <th class="col-md-3">Amount</th>
                <th class="col-md-1">X</th>
            </tr>
            <tr>







            </tr>
        </thead>
        <tbody class="details">
        <tr >
                <td class= count ></td>
                <td ><input type="text" name="product_name[]" value="ABC" class="form-control product_name" readonly >
                <td><input type="number" step="0.01" name="quantity[]" value="1" class="form-control quantity" autocomplete="off"></td>
                <td><input type="number" step="0.01" name="price[]" value="5" class="form-control price" ></td>
                <td><input type="number" step="0.01"  name="discount[]" value="0" class="form-control discount" autocomplete="off"></td>
                <td><input type="number" step="0.01"  name="tdiscount[]" value="0" class="form-control tdiscount" autocomplete="off"></td>
                <td><input type="number" step="0.01" name="amount[]" class="form-control amount" readonly></td>
                </tr>



</body>
</html>
<script>
$(function(){
            $('body').on('keyup','.discount,.tdiscount,.quantity,.price',function(){

                var tr      =   $(this).parent().parent();  
                var dis     =   tr.find('.discount').val();
                var tdis    =   tr.find('.tdiscount').val();
                var qty     =   tr.find('.quantity').val();
                var price   =   tr.find('.price').val();

                total   = (qty*price) -(0);

            $('.tdiscount').keyup(function(){
                alert(total);
                total   = (qty*price) -(tdis);
                alert(total);       
                dis = (tdis/qty);
                //tr.find('.discount').val(tdis/qty);   
        });

                tr.find('.amount').val(total);
            });


});
</script>

我想要的只是因为我给Tdis一些价值，而不是在扣除Tdis值和Tdis除以给定的QTY后更新AMOUNT文本框，并且更新值也会进入Pdis文本框。但是，如果我使用这段代码，我就不会成功...

$('.tdiscount').keyup(function(){               
  total = (qty*price) -(tdis);              
  tr.find('.discount').val(tdis/qty);       
});

它需要两倍于Tdis内部的 KEYPRESS 来更新Pdis文本框，请清楚我的困惑，为什么需要两次按键才能更新该值以及如何防止按两次。

感谢。

Answer 1

删除你的第二个keyup事件，你应该全部设置好。您也可以使用＆＃34;输入＆＃34;作为您的选择器而不是指定每个类以使其更简单。

$(function(){
        $('input').on('keyup', function(){

            var tr      =   $(this).parent().parent();  
            var dis     =   tr.find('.discount').val();
            var tdis    =   tr.find('.tdiscount').val();
            var qty     =   tr.find('.quantity').val();
            var price   =   tr.find('.price').val();

            total   = (qty*price) -(0);

            total   = (qty*price) -(tdis);
            alert(total);       
            dis = (tdis/qty);

            tr.find('.amount').val(total);
        });
});

无法更新函数

1 个答案: