how can putting link add after last new input when click on remove no after last input that clicked on remove. how is it?
when yo开发者_如何学Cu clicked on remove(no last remove) you see that link add append after input. Namely we have tow or several add link after clicked on remove. you in anywhere clicked on remove append link add on input, i want only once append in last new input no in anywhere.
I hope you understandEXAMPLE: http://jsfiddle.net/zgWr3/12/
$('a.remove_input').live('click', function (event) {
event.preventDefault();
var $class = '.' + $(this).closest('div.find_input').find('div').attr('class');
$(this).closest($class).prev().find('.adda .mediumCell').append('<a href="" class="add_input"></a>')
$(this).closest($class).remove();
});
With respect
For my HTML I would use something like:
<div id="inputs">
<div id="input_container_0">
<input type="text" name="price" placeholder="hello" />
</div>
</div>
<div>
<a href="Javascript:void(0);" class="action-add">add</a>
</div>
For my JavaScript I would use something like:
var number_of_inputs = 0;
$(function() {
$(".action-add").click(function() {
number_of_inputs++;
$("#inputs").append('<div id="input_container_'+number_of_inputs.toString()+'"><input type="text" name="price" placeholder="hello" /> <a href="Javascript:void(0);" rel="'+number_of_inputs.toString()+'" class="action-remove">remove</a></div>');
});
$(".action-remove").live('click', function() {
$("#input_container_"+$(this).attr("rel")).remove();
});
});
Hope that helps.
EDIT
Updated, so the remove link is not present for the first text box.
Here. Try this:
$(function () {
$('a.add_input').live('click', function (event) {
var $column = $(this).closest('div.add_units');
// clone the top input row
var newDiv = $($column.find('div.mediumCell').get(0)).clone(true);
// clear field values
newDiv.find('input').val(''); // clear the field
// add Remove link to new row
newDiv.append('<a href="#" class="remove_input">remove</a>');
$column.find('div.adda').before(newDiv);
event.preventDefault();
return false;
});
$('a.remove_input').live('click', function (event) {
event.preventDefault();
// find row
$row = $(this).closest('.mediumCell').remove();
});
});
精彩评论