I have this script to append a set of input fields. It works fine and all but my problem is every time I click on the button to append which is at the middle of the page, the page jumps to the top of the page. How can I stop it from jumping to the top? Sorry, here is the append script:
var count = 0;
$(function(){
$('a#add_field').click(function(){
count += 1;
$('#activation').append(
'<div id="features_remove" style="float:left; width: 11%; margin-left:115px;">'
+'<label>features remove</label>'
+'<select id="features_remove' + count + '" name=features_remove' + count + '" class="input-medium" >'
+'<option value="" selected=" " > </option>'
+'<option value="MPP" >MPP</option>'
+'<option value="50 Data" >50 Data</option>'
+'<option value="Navigation" >Navigation</option>'
+'<option value="Insurance" >Insurance</option>'
+'<option value="Road Side Assistance" >Road Side Assistance</option>'
+'</select>'
+'</div>'
);
});
});
And yes, it is a button
<a href="#" class="btn btn-mini btn-danger" id="add_field"><span>Add In-Store Activation</span></a>
Is the “button” used to add a field actually an
<a href="#">link?jQuery may be moving you to the top of the page because of the hash you might be using to prevent the default behavior of the link. But jQuery (or some of the plugins of it) may be using the hash as an inline anchor. Ie. href=”#listTop” would look up id=”listTop” element on the page and scroll top of the screen to the top of that element. href=”#” would effectively scroll you to the top of the screen.
Remember to return false from your jQuery click event handler or add parameter e into the event handler and call e.preventDefault(); in the method body.
And
This is the best shot I can give you with the info provided. You can help yourself to be helped by providing some code and more detailed description of your situation.