【问题标题】:Dynamically added tag doesn't work correctly with datepicker动态添加的标签不能与 datepicker 一起正常工作
【发布时间】:2016-05-10 19:13:37
【问题描述】:

我尝试在视图中添加动态标记。我想使用一个 jquery 插件作为 datetimepicker。 (http://xdsoft.net/jqplugins/datetimepicker/) 这行不通。

//$("#timeseriesDate" + i + "").datetimepicker({
//    timepicker: false,
//    format: 'Y/m/d',
//    formatDate: 'Y/m/d'
//});

function create() {
    var startDate = new Date($('#date1').val());
    var endDate = new Date($('#date2').val());
    var diff = datediff(startDate, endDate);
    $("#matrixtimeseries").empty();
    $("#matrixtimeseries").append('<div>');
    for (i = 0; i < diff; i++) {
        $("#matrixtimeseries").append('<input class="timeseries-red date" type="text" name=timeseriesDate' + i + 'id=timeseriesDate' + i + '"/>');
        //$("#timeseriesDate" + i + "").datetimepicker({
        //    timepicker: false,
        //    format: 'Y/m/d',
        //    formatDate: 'Y/m/d'
        //});
        for (var ii = 0; ii < 24; ii++) {
            $("#matrixtimeseries").append('<input class="timeseries-red" type="text" name=hourseries' + i + ii + 'id=hourseries' + i + ii + '" />');
        }
        $("#matrixtimeseries").append('<br/>');
    };
    $("#matrixtimeseries").append('</div>');
}

【问题讨论】:

    标签: javascript jquery jquery-ui jquery-plugins datetimepicker


    【解决方案1】:

    在生成的 HTML 中,nameid 之间需要一个空格。

    $("#matrixtimeseries").append('<input class="timeseries-red date" type="text" name=timeseriesDate' + i + ' id=timeseriesDate' + i + '"/>');
                                                                                                              ^
    

    i=1 时,您的 HTML 具有以下属性:name=timeseriesDate1id=timeseriesDate1

    或者您可以使用面向对象的方法而不是生成 HTML。

    $("#matrixtimeseries").append($("<input>", 
        "class": "timeseries-red date",
        "type": "text",
        "name": "timeseriesDate" + i,
        "id": "timeseriesDate" + i
    }));
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2018-11-10
      • 2014-07-01
      • 1970-01-01
      • 2016-07-19
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多