我在html中有一个表单。我使用Label Over plugin将输入元素的标签显示为提示。我正在使用AJAX提交信息，而无需将页面刷新到PHP页面并返回成功/错误消息。到目前为止，这些东西都运行良好。
问题是，一旦我提交表单并收到成功消息，我的输入元素提示就会消失。如果没有提示，用户无法提交其他反馈，如果他们想这样做，因为输入框是空白的。唯一的选择是刷新整个页面。我试图避免这种情况。 我只想在用户最初首次访问该网页时显示标签。
在成功功能中，您会看到我的评论为//如何在此处恢复标签???????这就是我试图分配提示的地方，就像之前页面加载时一样，但提示没有出现。我试图在成功执行时显示这些提示，以便用户可以再次填写信息＆amp;再次提交，无需重新加载页面。
以下是表格：
<form id="frm_contact" name="frm_contact" method="post" action="ajax_contact.php">
<div class="label">
<label class="pre" for="name">Enter Name</label>
<input name="name" type="text" id="name" size="42" title="Enter Name" />
</div>
<div class="label">
<label class="pre" for="email">Enter Email</label>
<input name="email" type="text" id="email" size="42" title="Enter Email" />
</div>
<select name="regarding" id="regarding" style="width: 295px;">
<option value="">Select a value</option>
<option value="Comment">Comment</option>
<option value="Compliment">Compliment</option>
<option value="Suggestion">Suggestion</option>
<option value="Other">Other</option>
</select>
<div class="label">
<label class="pre" for="comments">Comments</label>
<textarea name="comments" id="comments" cols="34" rows="5" ></textarea>
</div>
<div id="wrap">
<img src="get_captcha.php" alt="" id="captcha" name="captcha" />
<img src="images/refresh.gif" alt="Refresh Code" name="refresh" width="48" height="44" id="refresh" title="Refresh Code" />
</div>
<div class="label">
<label class="pre" for="security_code">Enter Security Code as shown above</label>
<input name="security_code" type="text" id="security_code" size="42" title="Enter Security Code as shown above" />
</div>
<input name="sbt_contact" type="image" id="sbt_contact" src="images/btn_send.jpg" alt="Send" />
</form>
这是javascript：
<script type="text/javascript">
// <![CDATA[
$('label.pre').labelOver('over');
// $(document).ready() is executed after the page DOM id loaded
$(document).ready(function(){
//Hide loading & success divs by default
$('#loading').hide();
$('#result_succcess').hide();
// Binding an listener to the submit event on the form:
$('#frm_contact').submit(function(e){
if($('#sbt_contact').hasClass('active')) return false;
// Adding the active class to the button. Will show the preloader gif:
$('#sbt_contact').addClass('active');
// Removing the current error tooltips
$('.errorTip').remove();
//Show loading icon
$('#loading').show();
//Prepare data to be sent
var dataString = $('#frm_contact').serialize()+'&fromAjax=1';
$.ajax({
type: "POST",
url: "ajax_contact.php",
data: dataString,
dataType: 'json',
success: (function(response)
{
//If no error was found, then clear the entered input
if(response.error == 0)
{
/*Completely reset the form if the form is successfully submitted*/
$(':input','#frm_contact')
.not(':button, :submit, :reset, :hidden, :image')
.val('')
.removeAttr('checked')
.removeAttr('selected');
//How to Restore labels here???????
//Using the following here, does not restore the labels
$('label.pre').labelOver('over');
//Remove all the success class for the form elements
$('#frm_contact :input').removeClass('success');
/*Reset Captcha.*/
$("img#refresh").trigger('click');
//Show the success box and fade it out after a delay of 10 seconds
$('#result_succcess').html('Your feedback has been successfully received. We will get back in touch with you shortly.').fadeIn('slow').delay(10000).fadeOut(400);
}
else
{
//Remove all the success class that has been previously assgined & do it freshly again
$('#frm_contact :input').removeClass('success');
// Looping through all the input text boxes,
// and checking whether they produced an error
$('#frm_contact input[type!=submit], #frm_contact input[type!=image], #frm_contact select, #frm_contact textarea, #frm_contact input[type=textarea]').each(function(){
var elem = $(this);
//var id = elem.attr('id');
var ele_name = $(this).attr('name');
var ele_type = $(this).attr('type');
//For the errors received, show errors
if(response.message[ele_name])
{
alert( 'errors' );
}
else
{
if( ele_name != 'sbt_contact' && ele_name != 'refresh' && ele_name != 'captcha' )
{
alert(ele_name);
}
}
});
}
})
});
//hide loading icon
$('#loading').hide();
e.preventDefault();
});
});
// ]]>
</script>