c# - 事件中的动态按钮单击句柄

Question

在下图中显示了场景，这里我需要计算我的动态按钮点击发生时的价格。(批发价 * 数量 = 商品总价)

Firebug 中的错误显示是:

txtId is not defined

我在这里尝试使用 javascript 来做到这一点。

 $('#pick').click(function () {
        this.disabled = true;
        var $option = $('#select-product option');
        var table = $('<table border="0" class="table table-bordered"><th>ItemName</th><th>Retail Price</th><th>Wholesale Price</th><th>Quantity</th><th>Calculate</th><th>Total Item Price</th></table>').addClass('product-table');
        var i=0;
        $option.each(function () {
            debugger;
            if ($(this).prop('selected')) {
                var txtId = 'txtQty' + i;
                var lblId = 'lblQty' + i;
                var row = $('<tr><td>' + $(this).text() + '</td><td>' + $(this).attr('RetailPrice') + '</td><td>' + $(this).attr('WholesalePrice') + '</td><td>' + '<input type="text" id="' + txtId + '">' + '</td><td> <button type="button" class="btn btn-warning btn-xs" onClick="CalcPrice(txtId,$(this).attr(\'WholesalePrice\'),lblId)">Calculate</button></td><td><label for="tempprice" id="lblQty' + i + '></label></td></tr>');
                table.append(row);
                i++;
            } 
        });

        $('#product-load-tbl').append(table);
    });

    function CalcPrice(txtId,prc,lblId) {
        debugger;

    }

Answer 1

既然你提到了

i need to Calculate the price when my dynamic button click occured

你必须像这样使用事件处理程序

$(document).on('click', '#pick', function () {
   //Your code
}

因为动态生成的按钮没有加载到 DOM 中，所以您需要使用委托(delegate)。

---

查看差异检查fiddle1和 fiddle2

HTML:静态

Fiddle1:

$('button').click(function () {
    alert("I'm clicked");
});
$('body').append('<button>Dynamic</button>'); //button will be append
                                              //click event won't work

fiddle 2:

$(document).on('click','button', function () {
    alert("I'm clicked");
});
$('body').append('<button>Dynamic</button>'); //Will for buttons created dynamcially