Javascript 从循环中获取变量

我有一个正在创建表的循环：

for(m=1; m<7; m++){

    document.getElementById('content').innerHTML += 
        ('<tr>' +
            '<td>' + m + '</td>' + 
            '<td><input type="checkbox" id="switch'+m+'"><label class="switch" for="switch'+m+'">Button ' + m + '</label></td>' +
        '</tr>')
}

这不起作用，因为所有提示loop=6最后一个值的按钮。 我知道这很混乱，但我希望你能理解。非常感谢您的帮助

将其更改为：

$(function() {
    var localM = m;
    $(buttons).button();
    $(buttons).click(function(){                        
        alert(localM);                                   
    });
}); 

---

问题是警报绑定到变量m，而不是m的值。通过在闭包内分配一个局部变量，您可以在循环中的该点捕获m的值。

您还可以用另一种方式绑定事件，例如sample

$("tr > td > input[type=checkbox]").function(e){                        
        alert(event.target.id);                                   
        //OR
        alert(this.id);                                   
});

如果可以在元素中添加任何类属性

那么这是安全的

 $("tr > td > input[type=checkbox].switch").function(){                        
        alert(event.target.id);                                   
    });

---

有很多方法可以做到这一点。这里有一个：

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">

$(document).ready(function()
{
    // Populate Form
    for (var m = 1; m <= 7; m++)
    {
        $('#content').append('<tr>' +
            '<td>' + m + '</td>' + 
            '<td><input type="checkbox" class="clickMe" id="switch'+m+'"><label class="switch" for="switch'+m+'">Button ' + m + '</label></td>' +
        '</tr>');
    }

    // Handle Click
    $('.clickMe').click(function()
    {
        alert('You clicked on : ' + $(this).attr('id')); // alerts "switchN" e.g. switch1

        // or //

        alert('You clicked on : ' + $(this).attr('id').replace('switch', '')); // // alerts "N" e.g. 1
    });

});

</script>

<table id="content"></table>

$（文档）.ready（函数（）
{
//填充表单
对于（var m=1；m这里有一点重构（减去
按钮（）
插件）：

var$content=$（“#content”）；
对于（var m=1；m<7；m++）{
$content.append(
'' +
“+m+”+
'' +
'' +
'按钮'+m+''+
'' +
''
);
}
$（'label.switch'）。单击（函数（e）{
e、 预防默认值（）；
警报（$（this.data（'num'））；
});

可能存在的副本
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">

$(document).ready(function()
{
    // Populate Form
    for (var m = 1; m <= 7; m++)
    {
        $('#content').append('<tr>' +
            '<td>' + m + '</td>' + 
            '<td><input type="checkbox" class="clickMe" id="switch'+m+'"><label class="switch" for="switch'+m+'">Button ' + m + '</label></td>' +
        '</tr>');
    }

    // Handle Click
    $('.clickMe').click(function()
    {
        alert('You clicked on : ' + $(this).attr('id')); // alerts "switchN" e.g. switch1

        // or //

        alert('You clicked on : ' + $(this).attr('id').replace('switch', '')); // // alerts "N" e.g. 1
    });

});

</script>

<table id="content"></table>

var $content = $('#content');
for (var m = 1; m < 7; m++) {
    $content.append(
        '<tr>' +
            '<td>' + m + '</td>' +
            '<td>' +
                '<input type="checkbox" id="switch' + m + '">' +
                '<label class="switch" data-num=' + m + ' for="switch' + m +'">Button ' + m + '</label>' +
            '</td>' +
        '</tr>'
    );
}

$('label.switch').click(function(e) {
    e.preventDefault();
    alert($(this).data('num'));
});