Question

以下代码创建了一个表格＆amp; jQuery中的文本框。

 var table = $("#dynamic-table").children();
 var row = $('<tr class="data"></tr>');
 row.append($('<td ><input type="text" value=' + item.Marks1 + '
               size="10px" class="marks" id="txtmarks1"  ></td>'));

我尝试使用以下不起作用的代码验证文本框。

$(".data").delegate(".marks","keyup",function () {        
    if ($('#txtmarks1').val().length > 2) {          
        if ($('#txtmarks1').val() > 100) {
            alert("does not exceed 100");
        }
    }
});

如果这不是正确的验证方式，请提出解决方案。

Answer 1

在页面加载后添加了事件目标部分$(".data")和目标选择器".marks"

因此delegate()方法无法定位目标栏.data选择器类您应该使用在页面加载时加载的父选择器或document用于委托选择器部分

$(document).delegate(".marks","keyup",function () {        
    if ($('#txtmarks1').val().length > 2) {          
        if ($('#txtmarks1').val() > 100) {
            alert("does not exceed 100");
        }
    }
})

Answer 2

$(".marks").keyup(function () {    
    if ($(this).val().length > 2) {          
        if ($(this).val() > 100) {
            alert("does not exceed 100");
        }
    }
});

<强> Demo

Answer 3

试试这个：

$("body").delegate(".data .marks","keyup",function () {        
    if ($('#txtmarks1').val().length > 2) {          
        if ($('#txtmarks1').val() > 100) {
        alert("does not exceed 100");
        }
    }
})

Answer 4

只需使用：

$(".data").change(".marks","keyup",function () {        
    if ($('#txtmarks1').val().length > 2) {          
        if ($('#txtmarks1').val() > 100) {
            alert("does not exceed 100");
        }
    }
})

Answer 5

试试 jsFiddle

   $(document).on('keyup', ".marks", function () {  
     if ($(this).val().length > 2) {          
         if ($(this).val() > 100) {
           alert("does not exceed 100");
         }
     }
   });

Answer 6

试试这个：

$('#dynamic-table').off('keyup').on("keyup",".marks",function () { 
      if ($('#txtmarks1').val().length > 2) { 
        if ($('#txtmarks1').val() > 100) { 
             alert("does not exceed 100"); 
        } 
     } 
}) ;

如何在jQuery中验证文本框

6 个答案: