重用JavaScript函数

时间:2016-04-24 03:26:10

标签: javascript php jquery html

创建蛋糕订购表格,可用的蛋糕数量可能因月而异。我试图调整从@Anderson Contreira创建的JS函数,但在我的小提琴中它不起作用。以下是我到目前为止的情况 -

为什么输入数量时没有任何改变?

https://jsfiddle.net/2uack1w6/

语法 的 JS

    function calculate(el){
    var quantity = el.val();
    var id = el.attr("id").replace("item_","").replace("_qty","");
    var data = {quantity: quantity,id:id};
    var targetTax = $("#item_"+id+"_tax");
    var targetTotalPrice = $("#item_"+id+"_totalprice");
    $.post($.post(window.alert("It's been one or two or three entered");
    });
}
var qty = $("#item_1_qty");
var qty1 = $("#item_2_qty");
var qty2 = $("#item_3_qty");
qty.on("keyup",function(){
    window.alert("It's been one or two or three entered");
});

HTML / PHP

<body>
<form id="Form1" runat="server">
    <div id="Form1" runat="server">
    <table id="table1" border="1">
        <tr>
            <th>Item</th>
            <th>Price</th>
            <th>Quantity</th>
            <th>Tax</th>
            <th>Total</th>
        </tr>
        <tr>
            <td><label for="lblChoccake">Choc Cake</label></td>
            <td><label for="lblitem1price">$25.00</label></td>
            <td><input  type="text" id="item_1_qty" name="txtitem1qty" value="0" maxlength="10" size="3"></td>
            <td><input  type ="text" id="item_1_tax" name="txtitem1tax" maxlength="10" size="3" readonly></td>
            <td><input  type="text" id="item_1_totalprice" name="txtitem1totalprice" maxlength="10" size="3" readonly></td>
        </tr>
        <tr>
            <td><label for="lblLemonFudgecake">Lemon Fudge Cake</label></td>
            <td><label for="lblitem2price">$15.00</label></td>
            <td><input  type="text" id="item_2_qty" name="txtitem1qty" value="0" maxlength="10" size="3"></td>
            <td><input  type ="text" id="item_2_tax" name="txtitem1tax" maxlength="10" size="3" readonly></td>
            <td><input  type="text" id="item_2_totalprice" name="txtitem1totalprice" maxlength="10" size="3" readonly></td>
        </tr>
        <tr>
            <td><label for="lblCoconut">Coconut Cake</label></td>
            <td><label for="lblitem3price">$35.00</label></td>
            <td><input  type="text" id="item_3_qty" name="txtitem1qty" value="0" maxlength="10" size="3"></td>
            <td><input  type ="text" id="item_3_tax" name="txtitem1tax" maxlength="10" size="3" readonly></td>
            <td><input  type="text" id="item_3_totalprice" name="txtitem1totalprice" maxlength="10" size="3" readonly></td>
        </tr>
    </table>
    </div>
</form>
</body>

2 个答案:

答案 0 :(得分:0)

scope :without_children_at(date) = {
  joins(:childs).where("DATE(created_at) != DATE(?)", date)
}

试试这个,你在文档实际加载之前分配变量。

答案 1 :(得分:0)

看看这里:https://jsfiddle.net/andersoncontreira/mtu6syby/1/

您可以进行一些更改并且效果很好:

在项_ _ _ qty的每个输入中添加一个类,例如:<input type="text" id="item_1_qty" class="item_qty" />

在您的javascript中,您可以将通话保留为通用:

jQuery(document).ready(function(){
    //you can use a class for help you
    $(".item_qty").on("keyup",function(){
    //window.alert("It's been one or two or three entered");
    calculate($(this));
    });
});