Javascript 模块模式值在警报中显示未定义

Question

我想要金额按钮附近的 Amont 文本框中的速率和数量结果，但它在文本框中显示 0，当警报值显示未定义时，任何人都可以帮助我，我在 javascript 中处于非常初级的水平...任何帮助将不胜感激。

这是我的 HTML

 <form method="POST">
 <pre>
    <label>Item id :  </label><input type="text" name="" id="txt_Item_id"><br>
    <label>Catogeory :</label><input type="text" name="" id="txt_Cato_geory"><br>
    <label>Quantity : </label><input type="text" name="" id="txt_Quan_tity"><br>
    <label>Rate :     </label><input type="text" name="" id="txt_Ra_te"><br>
    <input type="text" name="" id="txt_Amo_unt"> <input type="button" value="Amount" id="btn_T_Amount"><br>

    <label>Discount : </label><input type="text" name="" id="txt_Disc_ount"><br>
    <input type="text" name="" id="txt_Net"><input type="button" name="" id="btn_Net" value="Net"><br>
    <input type="button" value="+" id="btn_add"><br>
 </pre>
</form>
<table id="MyTable" border="1px solid black">
    <thead>
        <tr>
            <th>Sr#</th>
            <th>Catogeory</th>
            <th>Quantity</th>
            <th>Rate</th>
            <th>Amount</th>
            <th>%</th>
            <th>Discount</th>
            <th>Net</th>
            <th>Action</th>
        </tr>
    </thead>
    <tbody>
    </tbody>

</table>

Javascript 是

 $(document).ready(function(){
    var calc = new calculate();
    calc.rate();
    calc.discount();
    });

var calculate = function(){
    var txt_quantity = $('#txt_Quan_tity').val();
    var txt_rate     = $('#txt_Ra_te').val();
    var txt_Amount   = $('#txt_Amo_unt').val();
    var txt_discount = $('#txt_Disc_ount').val()/100;
    var txt_net      = $('#txt_Net').val();
    debugger
    var total_amount = txt_quantity * txt_rate;   // Total
    var total_net    = txt_discount * txt_Amount;   
    return{
        rate   : function(){
            $('#txt_Ra_te').on('input',function(){
                alert(txt_rate);
                // $('#txt_Amo_unt').val(total_amount);         

            });
        },   // End Rate Function
        discount : function(){
            $('#txt_Disc_ount').on('input',function(){

                // $('#txt_Net').val(total_net);

            });
        }

    };

};

Answer 1

请记住，您将变量calculate 设置为以下内容:

return{
    rate   : function(){
        $('#txt_Ra_te').on('input',function(){
            alert(calculate.txt_rate);
            // $('#txt_Amo_unt').val(total_amount);         

        });
    },   // End Rate Function
    discount : function(){
        $('#txt_Disc_ount').on('input',function(){

            // $('#txt_Net').val(total_net);

        });
    }

};

现在查看您的警报。您正在尝试访问该 return 语句中未定义的内容。 calculate 对函数表达式内部发生的事情一无所知。它只知道从中返回什么。

要解决此问题，只需从警报中删除 calculate. 即可，因为您不是从变量 calculate 内部访问某些内容，而是定义了一个闭包。

解决方案:alert(txt_rate);