Question

我正在使用ajax动态创建div。现在，如果ajax调用成功，那么我为div元素创建了一个字符串，并将其附加到原始div id。这是我的代码

 $.ajax({
    type:"GET",
    url:"resources/json/asnData.json",
    dataType:"json",
    success:function(data){
        $.each(data.Payload, function(index, val){
            i=i+1;
            stmt+='<div class="row">'+
                    '<section class="col col-2">'+
                        '<label class="input"><i class="icon-append fa fa-key"></i>'+
                            '<input type="text" name="keyName" value="'+val.key+'" readonly/>'+
                        '</label>'+
                    '</section>'+
                    '<section class="col col-3">'+
                        '<label class="select">'+
                            '<select id="dataConversionType'+i+'" class="dataConversionType">'+
                                '<option value="HEX">HEX</option>'+
                                '<option value="ALL">Compare All</option>'+
                                '<option value="ASCII">ASCII</option>'+
                                '<option value="STRING">STRING</option>'+
                                '<option value="INT">INTEGER</option>'+
                                '<option value="BINT">BIG INTEGER</option>'+
                            '</select><i></i>'+
                        '</label>'+
                    '</section>'+
                    '<section class="col col-5">'+
                        '<label class="input"><i class="icon-append fa fa-dashcube "></i>'+
                            '<input id="convertedType'+i+'" type="text" value="'+val.value+'" readonly/>'+
                        '</label>'+
                    '</section>'+
         '</div>';
        });
        $(".dataParser").append(stmt);

现在有一个功能，如果有人在selectbox中选择一个值，然后触发并显示。

 $('#dataConversionType'+i).change(function(e) {
            e.preventDefault();
            var conversionType=$(this).val(); //I have doubt here also..
            console.log(conversionType);
            if(conversionType == 'ALL') {
                console.log('ALL-Show a modal with each possible conversion');
            }

但这不起作用。如果我使用类名称调用此函数。但是我必须使用带有i值的id来调用函数，因此使用i值我还可以在其他字段中设置一些值。任何帮助将不胜感激......

Answer 1

使用class而不是id（用一些非动态容器替换文档）

 $(document).on('change','.dataConversionType',function(e) {
                e.preventDefault();
                var conversionType=$(this).val(); 
                console.log(conversionType);
                var index_val = $(this).attr('data-index')
                if(conversionType == 'ALL') {
                    console.log('ALL-Show a modal with each possible conversion');
                }
    )};

当您生成元素时，添加数据属性

'<select id="dataConversionType'+i+'" class="dataConversionType" data-index="'+i+'">'

此外，如果你在一个循环中，你需要将ajax包装在一个闭包中，如果你想获得正确的值而不是最新值。

(function(idx) {
  //ajax stuff here
}(i)

Answer 2

做一件事，使用类名本身而不是Id来收听更改事件。将i的值作为自定义属性放入选择框中。在侦听器函数中，读取此属性并调用或执行您必须执行的任何操作。

示例如下：

'<section class="col col-3">'+
                    '<label class="select">'+
                        '<select id="dataConversionType'+i+'" class="dataConversionType" data-count=i>'+
                            '<option value="HEX">HEX</option>'+
                            '<option value="ALL">Compare All</option>'+
                            '<option value="ASCII">ASCII</option>'+
                            '<option value="STRING">STRING</option>'+
                            '<option value="INT">INTEGER</option>'+
                            '<option value="BINT">BIG INTEGER</option>'+
                        '</select><i></i>'+
                    '</label>'+
                '</section>'

事件监听器： -

$('.dataConversionType').change(function(e) {
        e.preventDefault();
        var conversionType=$(this).val(); //selected value
        var valueofI = $(this).attr("data-count");// Value of i

}

data-count是自定义属性。

Answer 3

i的值现在已更改为最新版本，但无论如何都不会为您提供所有选择框。

如果您想要了解任何选择框，请执行以下操作：

$('#dataConversionType1').change(function(e) {
   // code here
});

如果您想在您创建的所有选择框上执行某些操作，可以执行以下操作：

$('[id^="dataConversionType"]').change(function (e) {
    // Find the index: Count of i
    var elmIndex = $(this).attr("id").replace("dataConversionType", ""); 

    // Reflects the value of it in related input field
    $("#convertedType3" + elmIndex).val($(this).val());
});

如果您希望稍后使用i的值进行操作，可以通过两种方式执行此操作：

在某些i属性中设置data-的值，例如：data-index=i（示例如下）：

'<select id="dataConversionType'+i+'" class="dataConversionType" data-index="' + i + '">'+
从id本身获取split或regex的索引（例如：/ \ d /）。

Answer 4

尝试更改方法

public class DrivedClass: BaseClass,Interface
{
  public T method<T>() where T : BaseClass
    {
      var derviedObj = Activator.CreateInstance(typeof(T));
      return (T)derviedObj ; 

    }
}


 DrivedClass drOb = new DrivedClass ();
 var v = drOb.method<desiredType_T>();

Answer 5

$('#dataConversionType1').change(function(e) {alert("Changed")});

此代码不适用于动态追加选择框。你应该试试 -

  $(document).on("change","#dataConversionType1",function(){
alert($('#dataConversionType1 option:selected').val());
});

这适合我。

如何获取动态创建的选择框的值

5 个答案: