2013-01-02 92 views
0

編輯發佈此消息後不久我意識到我的錯誤。該append應該是html()text()在表單提交後使用jquery更改div中的文本

部分代碼:

<script type="text/javascript" language="javascript"> 
     $(document).ready(function(){ 
      $('#resetpassword').validate(
      {rules: { 
       secretAnswer: { 
        required: true 
       } 
      }, 

      messages: { 
       secretAnswer: { 
        required: "Please answer your security question" 
       } 
      }, 
      submitHandler: function(form){ 
       $.post("../BackgroundOperations/resetpassword.php", 
        $('#resetpassword').serialize(), 
        function(data){ 
         if(data.status == 0){ 
          $('#message').append("<span class='error'>Error: " + data.message + "</span>"); 
         } 
         else{ 
          $('.container').hide(); 
          $('.short_explanation').hide(); 
          $('#message').text(data.message); 
         } 
        }, 
       "json"); 
      } 
      }); 
     }); 
    </script> 
</head> 
<body> 

<!-- Form Code Start --> 
<div id='fg_membersite'> 
<form id='resetpassword' method='post' accept-charset='UTF-8'> 
<fieldset > 
<legend>Reset Password</legend> 

<div class='short_explanation'>* required fields</div> 
<input type='text' class='spmhidip' name='<?php echo $vm->GetSpamTrapKey(); ?>' /> 

<div id="message"></div> 
<div class='container'> 
    <label for='emailAddress' >Email Address:</label><br/> 
    <input type='text' name='emailAddress' id='emailAddress' maxlength="100" readonly="true" value="<?php echo $vm->GetEmailAddress() ?>" /><br/> 
</div> 
<div class='container'> 
    <label for='secretQuestion' >Security Question:</label><br/> 
    <input type='text' name='secretQuestion' id='secretQuestion' value='<?php echo $vm->GetSecretQuestion() ?>' maxlength="100" readonly="true" width="100" /><br/> 
</div> 
<div class='container'> 
    <label for='secretAnswer' >Answer:</label><br/> 
    <input type='text' name='secretAnswer' id='secretAnswer' maxlength="50" /><br/> 
</div> 
<div class='container'> 
    <input type='submit' name='Submit' value='Submit' /> 
</div> 

</form> 

我測試無效輸入(錯誤的安全性的答案)。當我提出錯誤答案並提交表單時,<div id="message">得到了錯誤消息的更新,但是如果我一直提交無效數據,<div id="message">會保留舊錯誤消息,並在最後添加一個新錯誤消息而不是隻有一條消息。

回答

2

而不是

$('#message').append("<span class='error'>Error: " + data.message + "</span>"); 

使用

$('#message').html("<span class='error'>Error: " + data.message + "</span>"); 
相關問題