我正在尝试重写此Jquery http://jsfiddle.net/Claudius/gDChA/4/以改为使用此HTML http://pastie.org/2370829
Jquery的:
$('button.add', '#companyinfo').live('click', function(e) {
$(this).parent().find('button.remove').show();
$(this).hide();
var element = $(this).parents('.input').find('input').last().clone().prop('value','');
var name = element.prop('name');
var pattern = new RegExp(/\[(.*?)\]/);
var info = name.match(pattern)[1];
var newname = name.replace(pattern, '[' + info + 'info' + ']');
var newid = element.prop('id') + 'info';
element.prop('name', newname);
element.prop('id', newid);
element.insertAfter($(this).parents('.input').find('input').last());
})
$('button.remove', '#companyinfo').live('click', function(e) {
$(this).parent().find('button.add').show();
$(this).hide();
$(this).parents('.input').find('input').last().remove('input');
});
旧HTML
<fieldset id='companyinfo'><legend>Company info</legend>
<div class='input string optional'>
<label for='company_navn' class='string optional'>Count</label>
<input type='text' size='50' name='company[count]' id='company_navn' maxlength="255" class='string optional' />
<div class='button-row'>
<button class='add'>Add info</button>
<button class='remove'>Remove</button>
</div>
</div>
<div class="input string optional">
<label for="company_navn" class="string optional">Navn</label>
<input type="text" size="50" name="company[navn]" maxlength="255" id="company_navn" class="string optional">
<div class='button-row'>
<button class='add'>Add info</button>
<button class='remove'>Remove</button>
</div>
</div>
</fieldset>
新HTML:
<div class="input string optional"><label for="virksomhed_navn" class="string optional"> Navn</label><input type="text" size="50" name="virksomhed[navn]" maxlength="255" id="virksomhed_navn" class="string optional"></div>
<div class="button-row" style="font-size: 11px; width: 110px; float: right; margin-top: -10px; margin-right: 16px;">
<button class="add" style="font-size: 11px;">Add info</button>
<button class="remove" style="font-size: 11px;">Remove</button>
</div>
<div class="input string optional"><label for="virksomhed_name" class="string optional">Name</label><input type="text" size="50" name="virksomhed[name]" maxlength="255" id="virksomhed_name" class="string optional"></div>
<div class="button-row" style="font-size: 11px; width: 110px; float: right; margin-top: -10px; margin-right: 16px;">
<button class="add" style="font-size: 11px;">Add info</button>
<button class="remove" style="font-size: 11px;">Remove</button>
</div>
<div class="input string optional"><label for="virksomhed_pis" class="string optional">Pis</label><input type="text" size="50" name="virksomhed[v]" maxlength="255" id="virksomhed_pis" class="string optional"></div>
<div class="button-row" style="font-size: 11px; width: 110px; float: right; margin-top: -10px; margin-right: 16px;">
<button class="add" style="font-size: 11px;">Add info</button>
<button class="remove" style="font-size: 11px;">Remove</button>
</div>
如何在新HTML中选择输入字段并创建相同的功能?
答案 0 :(得分:0)