在jquery中获取div的特定输入（子）元素的id或类名

Using bellow code i am dynamically created the table. In this table the 4th td have dynamic data with div what i want is When user select textbox want to remove child div then append textbox or if he select fileupload then append upload field in that td tag only

使用波纹管代码我动态创建表。在这个表中第4个td有动态数据div我想要的是当用户选择文本框想要删除子div然后追加文本框或者如果他选择fileupload然后只在该td标签中追加上传字段

//some lines of table opening and header code comes here
$.each(data,function(key,value){
    MoreTag += '<tr><td style="width: 10px">'+value.Id+'</td>';
    MoreTag += '<td>'+value.installment_number+'</td>';
    MoreTag += '<td>'+value.instal_title+'</td>';

    //4th td element 
    MoreTag += '<td id="tabledata">'+        
                '<div id="fields'+value.installment_number+'">'+
                    '<label style="font-weight:normal"><input name="resp'+value.installment_number+'" type="radio" id="textbox" class="textbox">&nbsp;Text Box</label>'+
                    '&nbsp;<label style="font-weight:normal"><input name="resp'+value.installment_number+'" type="radio" id="fileupload" class="fileupload">&nbsp;File Upload</label>'+
                '</div></td>';
    MoreTag += '<td>'+value.instal_amount+'</td></tr>';
});
MoreTag += '</tbody>';
MoreTag += '</table>';
MoreTag += '</div>';
$('#listofstudloanschedules').append(MoreTag);

I am tring with this script

我正在使用这个脚本

var childinput = '';
$(document).on('change',"#tabledata",function(){
    var name = $(this).children("div").prop("id");
    $("#" + name + " input").click(function(){
         childinput = $(this).attr("id");
         alert(childinput);
    });
});

By this i got perticular field id or class name.

通过这个我得到了特定的字段ID或类名。

problem But for every rows 4th td the first click was not alerting..

问题但是对于每行第4个td，第一次点击没有提醒..

3 个解决方案

#1

let me give you simple code snippet, but you have to modify value of input type radio button as per your requirement

让我给你简单的代码片段，但你必须根据你的要求修改输入类型单选按钮的值

$(document).ready(function() {
    $('input[type=radio]').change(function() {
		if (this.value == 'textbox') {
            alert("textbox");
        }
        else if (this.value == 'uploadfile') {
            alert("uploadfile");
        }
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<td id="tabledata">
        <div id="text_fields">
            <label style="font-weight:normal"><input name="resp'+value.installment_number+'" type="radio" id="textbox" class="textbox" value="textbox">Text Box</label>
            <label style="font-weight:normal"><input name="resp'+value.installment_number+'" type="radio" id="fileupload" class="fileupload" value="uploadfile">Upload File</label>
        </div>
    </td>

#2

You can get id of upload input by using jquery .on("click") event like following.

您可以使用jquery .on（“click”）事件获取上传输入的ID，如下所示。

$("div#text_fields input").on('click',function(){
        var name=$(this).attr("id");
        console.log(name);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<td id="tabledata">
        <div id="text_fields">
            <label style="font-weight:normal"><input name="resp'+value.installment_number+'" type="radio" id="textbox" class="textbox">Text Box</label>
            <label style="font-weight:normal"><input name="resp'+value.installment_number+'" type="radio" id="fileupload" class="fileupload">Upload File</label>
        </div>
    </td>

#3

This is the right solution as per my requirement.

根据我的要求，这是正确的解决方案。

$(document).on('change',"#tabledata",function(){
    var childinput=$(this).find("div input:checked").prop("id");
    alert(childinput);
});

#1