Question

我正在尝试使用jQuery在我的网页中添加一些html。我的代码是

 var s1 = "<div class='controls'><label class='inline labelspace'>Minimum Cart Value<input class='inline input-small' type='text' name='mincart' onKeydown=isNumberKey ></input></label>";
s1 += "<label class='inline labelspace'>Minimum No Of Items<input class='inline input-small' type='text' placeholder='Enter Integer' name='minitem' onKeydown=isNumberKey></input></label>" ;
s1 += "<label class='inline labelspace'>Location<input class='inline input-small' type='text' name='location' ></input></label>";
s1 += "<label class='inline labelspace'>Product Ids<input class='inline input-small' onKeydown=isValid type='text' name='products'></input></label></div>" ;
$("#lastrow").before(s1);

isNumberKey是一个源代码为

的函数

function isNumberKey(evt) {
  console.log('coming to this');
    var charCode = (evt.which) ? evt.which : event.keyCode;
    if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)) {
        return false;
    } else 
        return true;

}

使用这些功能，只能在文本框中输入数字。当我指定一些像这样的元素 $("#some_elem").onKeyDown(isNumberKey)然后它正常工作，但我想知道为什么它在第一种情况下不起作用。

Answer 1

您必须delegate此事件。使用：

$(document).on('keydown' , '.some-class', isNumberKey);

如果您append新标elements，则event不会绑定在其上。所以你需要委托它。

使用class代替id。当然，class需要添加到appended div，或者在这种情况下，我需要添加到input。

如果您使用$('.some-class').on('event', function(){})，则该活动仅会附加在.some-class的现有元素上。使用委派会将event附加到您想要的任何div上。

Answer 2

如果您想在HTML中使用，请尝试更改以下代码

onKeydown="isNumberKey()"

动态添加时，onKeydown无效

2 个答案: