Question

我正在构建数据表并通过在数据库中设置总记录来计算它们的总数。

现在我对JavaScript中的点击事件感到困惑。这就是我这样做的方式：

 for (var cnt = pageno; cnt < pageno + 5; cnt++) {
                $("#newList").append('<li id="pageno" value=""' + cnt + ' onclick="GetPageno();" > ' + cnt + '</li>');
            }

这是我当前的循环，将设置5个列表的数量。现在，如果我想获得当前列表的值，那么我这样做：

function GetPageno() {
        //this.val();


        alert(document.getElementById('pageno').val());


    }

我在网页上有1到5个数字列表。

如何获得我点击的那个数字的值？

实施例。如果我单击“5”，则警报应该以值“5”出现，与所有列表元素相同。

Answer 1

通过执行此<li id="pageno"，您不止一次重复相同的ID，这是不正确的。

而是使用<li id="pageno_'+cnt+'"并使用以下代码。

$(document).on('click','li[id^="pageno_"]',function(){
   alert($(this).attr('value'));
});

`DEMO`

Answer 2

您在val()上调用li这是不正确的，您可以使用.attr（“value”）如果您使用data()属性，例如data-someattributeName，那会更好让它更清楚。您将相同的ID分配给多个不合法的元素。为它们分配一个类并将事件与类绑定，您将能够获得所需的属性。

在创建li元素时将类添加到li元素，您没有正确地将cnt分配给value并将空字符串赋值给

for (var cnt = pageno; cnt < pageno + 5; cnt++) {
     $("#newList").append('<li id="pageno" class="pageno" value=""' + cnt + ' onclick="GetPageno();" > ' + cnt + '</li>');
}

使用class selector

绑定点击事件

$(".pageno").click(function() {
    alert($(this).attr('value'));
})

Live Demo ，使用data()和类选择器。在这里，我还为Ids分配了唯一 pageno。

pageno = 1;
for (var cnt = pageno; cnt < pageno + 5; cnt++) {
     $("#newList").append('<li id="pageno"'+cnt+' class="pageno" data-custom="' + cnt + '" onclick="GetPageno();" > ' + cnt + '</li>');
}

$(".pageno").click(function() {
    alert($(this).data('custom'));
});

Answer 3

ID必须是唯一的，您可以这样做：

for (var cnt = pageno; cnt < pageno + 5; cnt++) {
   $("#newList").append('<li class="pageno" value="'+cnt+'"> ' + cnt + '</li>');
}

和

$("#newList").on("click", "li.pageno", function() {
  alert( $(this).val() );
});

jsFiddle Demo

Answer 4

您的value属性存在一个小错误。在cnt之后移动的双引号。并将li对象传递给函数，即GetPageno（this），如下所示，

 for (var cnt = 1; cnt <= 5; cnt++) {
     $("#newList").append('<li id="pageno" value="' + cnt + '" onclick="GetPageno(this);" > ' + cnt + '</li>');
 }

然后获取方法中传递的li对象的值。

function GetPageno(obj) {
    alert(obj.value);
}

Answer 5

ID应该是唯一的，您应该使用类来代替。然后，您可以使用jQuery.each()来迭代您的课程：

$(".pageno").each(function() {
    alert($(this).attr('value'));
})

Answer 6

由于以下原因，您遇到了问题：

id必须是唯一的，您应该使用class。
您还应该在事后附上您的活动，而不是内联（首选项）。

请将您的元素称为this并使用.text()而不是.val()，因为value不是li上的有效属性。< / p>

for (var cnt = 1; cnt < 5; cnt++) {
    $("#newList").append('<li class="pageno" ' + cnt + '>' + cnt + '</li>');
}
$('.pageno').click(GetPageno);

function GetPageno() {
    alert($(this).text());
}

Answer 7

这样做：

for (var cnt = pageno; cnt < pageno + 5; cnt++) {
                    $("#newList").append('<li id="pageno"+cnt value=""' + cnt + ' onclick="GetPageno(this.value);" > ' + cnt + '</li>');
                }
    function GetPageno(val) {


            alert(val);


        }

Answer 8

你应该使用所有

的类名而不是id。 id必须在整个html页面中唯一

您可以更改代码，如

for (var cnt = pageno; cnt < pageno + 5; cnt++) {
 $("#newList").append('<li class="pageno" value="'+cnt+'"> ' + cnt + '</li>');
}

并在文档就绪范围中添加新的jquery函数

$(".pageno").click(function() {
alert($(this).attr('value'));

}）

javascript：通过单击循环中的当前值获取值

8 个答案:

`DEMO`