Question

我有一个添加新输入的按钮。该输入具有相同的类（commonClass）。首先输入datepicker没问题或正确显示。然后我点击按钮，显示第二个输入，类名为commonClass（与第一个输入相同）。但是，日期选择器没有用。我尝试使用$（＆＃39; [input ^ = start_date]＆＃39;）和$（＆＃39; .commonClass＆＃39;）也没有用。我也尝试过（＆＃34;＃start_date0，＃start_date1等等＃34;）也没有用。

var level1=0;
function tambah_level1() {
    level1=level1+1;
    var addin='<tr id="level1-'+level1+'"><td><input type="text" id="start_date'+level1+'" class="commonClass" name="start_date[]"><td><button type="button" onclick="hapus_level1('+"'#"+'level1-'+level1+"'"+')">Hapus</button></td></tr>';

    $('#addNew').append(addin);
}

function hapus_level1(id) {
    $(id).remove();
}

$(function(){
$(".commonClass").simpleDatepicker({ 

    dateFormat: 'yy-mm-dd',
    changeMonth: true,
    changeYear: true,
    timeFormat: 'hh:mm:ss'
});

表示html：

<tr id="level1">
    <td>Tanggal : </td>
    <td>
    <button type="button" onclick="tambah_level1()"> Tambah Tanggal</button></br>
    <table id="addNew" border=1>
    <tr>
        <th>Tanggal</th>
        <th>Action</th>
    </tr>
    <tr>
        <td><input type="text" name="start_date[]" id="start_date0" class="commonClass"></td>
        <td>-</td>
    </tr>
    </table>
    </td>
</tr>

非常感谢你。

Answer 1

对于新添加的元素，您需要在创建这些元素后初始化插件

$(document).ajaxStart(function() {
    $('#container').append("<div class='progress'></div>");//
}).ajaxStop(function(){
    $('.progress').remove();
});

.progress {
    position: fixed;
    top: 35%;
    left: 45%;
    width: 50%;
    height: 50%;
    background-image: url('/images/progress.gif');
    background-repeat: no-repeat;
    background-size: 10%;
    z-index: 9999;
}

$('#settings-commit').click(function(event) {
    event.preventDefault();

    $.ajax({
        type    : 'POST',
        url : ..............,
        data    : { ............ },
        dataType: 'json',
        success : function(data) {
            if (data.status == 'ok') {
                ...................
            } else {
                ...................
            }
        },
        error   : function() {
                ...................
        }
    });
});

事件

1 个答案: