Question

Hello StackOverflow，

我想知道在使用jQuery以编程方式添加控件（在本例中为输入文本框）之后是否有触发事件的方法。我的意思是，我在表中使用jQUery.after（）添加了一行填充s和输入到表，并且此新行中的控件不会触发任何事件。

我真的需要这方面的帮助，经过大量的“谷歌搜索”我无法弄明白，我再也不能挣扎了。一些帮助将非常感激。

如果不够清楚，不要提出任何问题以使其更清楚。

编辑（这是我要添加的行）

$(".prodNum").on("change", function(){
                //Envoie le sku du produit au serveur et affiche les infos lorsque le produit est valide
                $.post("../PHP/caisse.php", {productSku : $(this).val()}, 
                    function(data){
                        var total = 0;
                        var jsonObj = $.parseJSON(data);
                        var newRow = "";

                        if( typeof jsonObj.message !== "undefined")
                        {
                            alert(jsonObj.message);
                        }
                        else
                        {
                            total = jsonObj.price;

                            $("#desc" + numberOfProducts ).val(jsonObj.description);
                            $("#prix" + numberOfProducts ).val(roundToDecimals(jsonObj.price,2));
                            $("#qte" + numberOfProducts ).val(1);
                            $("#total" + numberOfProducts ).val(roundToDecimals(total,2)).change();

                            newRow = addProductRow(numberOfProducts);

                            $("#prod" + numberOfProducts ).after(newRow);

                            numberOfProducts++;
                        }
                    });
            });

这是addProductRow函数

function addProductRow(numOfProd)
{
if( numOfProd % 2 == 0 )
{
    newRow = "<tr class=\"alternate1\" id=\"prod" + numOfProd + "\">";
}
else
{
    newRow = "<tr class=\"alternate2\">";
}

newRow += "<td><input type=\"text\" class=\"prodNum\" name=\"prodNum[]\" id = \"prodNum" + (numOfProd + 1) + "\" /></td>";
newRow += "<td class=\"middle\"><input type=\"text\" class=\"desc\" id=\"desc" + (numOfProd + 1) + "\" /></td>";
newRow += "<td class=\"middle\"><input type=\"text\" class=\"price\" id=\"prix" + (numOfProd + 1) + "\" /></td>";
newRow += "<td class=\"middle\"><input type=\"text\" class=\"qty\" id=\"qte" + (numOfProd + 1) + "\" /></td>"; 
newRow += "<td class=\"middle\"><input type=\"text\" class=\"total\" name=\"total[]\" id=\"total" + (numOfProd + 1) + "\" /></td></tr>";

return newRow;

}

预期结果是新行可以在其“prodNum”输入上使用“更改”事件。

谢谢，

PBaller

Answer 1

尝试live代替bind - 请注意，在jQuery 1.7中，不推荐使用。live()方法。因此，如果您使用的是jQuery 1.7或更高版本，请使用.on()。

http://api.jquery.com/live/

 // jQuery 1.3+
 $("a.offsite").live("click", function(){ alert("Goodbye!"); });  

 // jQuery 1.4.3+              
 $(document).delegate("a.offsite", "click", function(){ alert("Goodbye!"); });

http://api.jquery.com/on/

$("#dataTable tbody").on("click", "tr", function(event){
    alert($(this).text());
});

当使用jQuery以编程方式添加时，事件不会在输入上触发

1 个答案: