Question

我目前正在处理的页面有一个＆＃34;添加另一个＆＃34;选项，插入包含标题和3个输入框列表的字段集。为了表单提交，这些输入框中的每一个都需要被赋予具有递增值的名称。（"field1_1"，"field1_2"等）

我知道我可以通过动态创建$('<input/>', {...});元素来添加字段，但是对于多个元素，这会使代码难以阅读且难以维护。

我目前正在使用jQuery的.load()函数来提取文件但是通过搜索我无法找到将变量传递给响应的方法，因此只能使用预设名称属性值。

这是可能的，还是唯一的方法？

Answer 1

将模板放入虚拟脚本中，类型未知，以避免错误：

<script id="template1" type="text/template">
    <h2>{title}</h2>
    <input type="text" name="field{id}_1">
    <input type="text" name="field{id}_2">
    <input type="text" name="field{id}_3">
</script>

然后使用replace（使用＆＃34; g＆＃34;全局选项作为替换通常仅替换第一个）来插入您的值。

var template = $('#template1').html();
template = Template.replace(/\{title\}/g, mytitle);    
template = Template.replace(/\{id\}/g, nextId);
$('#somewhere').append(template);

你当然可以连接替换，但在这里可读。

此方法允许使用复杂的HTML，而不会使用大量字符串操作来破坏代码。您的模板看起来像最终结果，因此不需要进行心理翻译。非常低维护的技术。

占位符只能是简单的名称（没有大括号），以避免使用正则表达式分隔符，只要名称与模板中的其他名称不匹配即可。我只是使用大括号，因此占位符在模板中脱颖而出（再次出于维护目的）。

添加包含动态属性值的HTML表单

1 个答案: