0

进行这种操作案例的最佳方法是什么：

当使用组合框的触发器为change时，我想更改之前添加到表单中的 textField 的类型。

我的样本数据收集：

function DataProvide(){
    selectValues = { 
        "choose"        : "-Choose-",
        "id"            : "ID",
        "emp_name"      : "Employee Name",
        "photo_path"    : "Photo Path",
        "emp_id"        : "Employee ID",
        "start_date"    : "Start Date",
        "birth_date"    : "Birth Date"
    };

    $.each(selectValues, function(key, value) {   
         $('#data1_1')
             .append($("<option></option>")
             .attr("value",key)
             .text(value)); 
    }); 
}

$(document).ready(function() {
     DataProvide();
});

数据已显示在组合框中。

然后我使用$.append()向表单添加一个字段

var count = 1;
$(".addCF").click(function(){
    count += 1;
    var $row = $('<tr>' 
    + '<td>' + '</td>'
    + '<td>' + '<input id="data2_' + count + '" type="text" name="data2[]" class="data2" value="" placeholder=""/>' + '</td>' 
    + '<td>' + '<input id="data3_' + count + '" type="text" name="data3[]" class="data3" value="" placeholder=""/>' + '</td>' 
    + '<td>' + '<a href="javascript:void(0);" class="remCF">Remove</a>' + '</td>' 
    + '</tr>').appendTo("#customFields");
    $row.find('td:first').append($('#data1_1').clone())
});

    $("#customFields").on('click','.remCF',function(){
        $(this).parent().parent().remove();
        count -= 1;
    });

看法

直到现在，我已经如我所愿地成功了。

但我想对第 3 列做一个小改动。当我选择例如“ start_date ”触发（组合框）时如何操作此表单的最佳方式然后该字段将更改为使用我添加jQuery UI 以显示日期选项的类“ onlyDate ”。

我补充说：

$(".onlyDate").datepicker({
    dateFormat: "dd-mm-yy"
});

然后检查组合的值 $("#customFields").on('change', '.tabelBaru', function() {

if(nilai=='gender'){
            $this.closest("tr").find(".data3").replaceWith(
                '<select name="data3[]" class="data3">'
                    + '<option value="man" selected >Man</option>'
                    + '<option value="woman">Woman</option>'
                + '</select>'
            )
        }else if(nilai=='start_date'){
            $this.closest("tr").find(".data3").replaceWith(
                '<input type="text" name="data3[]" value="" class="onlyDate"/>'
            )
        }
};

但是 jQueryUI datepicker并没有像往常一样出现。但是如果正常的表格（不使用$.append）都运行正常。

我如何解决它？

4

1 回答 1

1 
$(".onlyDate").datepicker({
    dateFormat: "dd-mm-yy"
});

当这段代码执行时，它只会找出当前语句的类名只有日期的对象。

之后，在页面上附加类名 onlyDate 的任何对象都不会执行 datepick 代码。

也许您应该尝试 jquery 函数“委托”或在每次追加后执行 datepicker 代码。

于 2013-09-04T03:43:45.450 回答