如何通过ID引用java脚本中的动态生成元素?

时间:2015-09-17 17:04:54

标签: javascript jquery html css twitter-bootstrap-3

我在java脚本中有以下代码:

$(document).ready(function(){
    var i = 1;
    $("#add_row").click(function(){
        $('#listOfCommercials').append('<div id="singleCommercial' + i + '"></div>');
        $('#singleCommercial' + i).html('...');

        i++; 
        alert(i);
    });

    $("#delete_row").click(function() {
        if (i > 1) {
            $("#singleCommercial" + (i - 1)).html('');
            i--;
        }
    });
});

每次用户按下按钮时都会生成额外的字段。你可以在我的小提琴http://jsfiddle.net/7yd5o63q/4/中看到它我希望在那里包含datetimepicker,通常我会写:

$('#datetimepicker').val(dd+"/"+mm+"/"+yy+" "+time);
    jQuery('#datetimepicker').datetimepicker({
    });

但是因为我会生成很多字段:      那我怎么能引用所有这些并将日期时间选择器附加到所有这些(似乎所有这些的id都不一样)?

感谢。

2 个答案:

答案 0 :(得分:1)

您可以使用类而不是ID。

    <b><font color="#0066FF">English </font><br><font color="#FF00FF"><br></font><br><br><font color="#6666FF">Account Number: 1234567890 Account Holder </font><br><br><font color="#990000">Name:  Swift Code: <img src="logo.png"></font></b>

答案 1 :(得分:1)

您实际上并不需要ID来进行设置:

$(document).ready(function(){
    $("#add_row").click(function(){
        var newCommercial = $("<div class='singleCommercial'><div class='form-group'>...<input class='datetimepicker'...</div>");
        newCommercial.appendTo($('#listOfCommercials'));

        newCommercial.find('.datetimepicker').val(dd+"/"+mm+"/"+yy+" "+time).datetimepicker();
    });

    $("#delete_row").click(function() {
        $(this).closest('.singleCommercial').remove();

    });
});