使用 jquery 动态添加隐藏输入答案

【问题标题】：dynamically add hidden inputs with jquery使用 jquery 动态添加隐藏输入
【发布时间】：2013-04-18 16:11:30
【问题描述】：

我使用 jquery 动态添加一个隐藏的输入字段，该字段在选项选择时将值填充到我的表行中。该功能正在执行，但问题是在新选择上没有被每个选项覆盖，选择一个新的输入字段正在添加。另一个问题是每次我添加 2 个 ipnut 字段时。我的代码看起来像

    jQuery(".add_column").change('select',function(event){             
       var selected_column = $j(this).find(":selected").val();
       var selected_value  = $j(this).parent('tr').data('id');
       var column_type;
       $j(this).find("option:selected").each(function(){
            column_type = ($j(this).parent().attr("label") );                   
        });

       $j('<input/>',{type:'hidden',value:selected_value+'|'+selected_column , name:column_type+'[]'}).appendTo($j(this).parent('tr'));

    });

【问题讨论】：

正在添加输入字段，因为您正在添加输入字段$j('<input/>',...您可以发布html以获得清晰的图片
修复了第二个问题，它在 2 个更改事件中。对于第一个问题，我认为我必须删除新的选择输入字段并添加一个新的
当然你需要remove()，或者如果<option>的索引是已知的，你可以做.eq(n).html()
好的，现在我在将输入数组发布到我的 php 脚本时遇到问题

标签： jquery events

【解决方案1】：

出于安全原因，不要使用对象语法来构造元素。您可以使用字符串构造函数：

 $('<input name="inputs[]" type="hidden" value="'+value+'" />').appendTo('#inputs-content');

最好用这种方法。

尝试：http://jsfiddle.net/zM8zy/ （打开浏览器控制台并检查 DOM 元素以显示结果）

【讨论】：