單擊退格或刪除字符時剩餘字符不會遞減

我寫了一個按鍵事件來顯示我的文本區域控件的剩餘字符。它目前顯示輸入時留下的字符數，但在單擊退格鍵或從文本區域刪除某些字符時不會減少。有人能告訴我的問題是單擊退格或刪除字符時剩餘字符不會遞減

$('#GeneralAgreementName').keypress(function() { 

     if (this.value.length > 150) { 
      return false; 
     } 
     else { 
      $("#remainingGeneralAgreementName").html("Remaining characters : " + (150 - this.value.length)); 
     } 
    });

來源

2017-05-08 Tom

因爲你不檢查，看看是否的關鍵是要實際添加的字符。是否有你不使用maxlength的原因？ – epascarello

@epascarello他爲什麼需要這樣做，它將如何解決這個問題？ –

@MikaelLennholm因爲輸入150個字符，你不能命中退格和最大長度將阻止輸入.... – epascarello

使用事件，而不是keypress什麼。此外，不知道爲什麼你從事件處理程序返回false。相反，將最大長度添加到文本框中，並返回剩餘的字符。

$('#GeneralAgreementName').keydown(function() { 
 

 
     var charactersLeft = 150 - this.value.length; 
 
     $("#remainingGeneralAgreementName").html("Remaining characters :" + (charactersLeft> 0 ? charactersLeft : 0)); 
 
     
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="GeneralAgreementName" maxlength="150" type="text"> 
 
<span id="remainingGeneralAgreementName"></span>

來源

2017-05-08 15:34:19 Agalo

OP的狀態仍然存在相同的問題 – epascarello

哪個鍵或字符不起作用？ – Agalo

鍵入150個字符並回退，不會刪除任何內容。也沒有考慮粘貼（不同的問題） – epascarello

嘗試使用的keydown功能。

$('#GeneralAgreementName').keydown(function() { 
 

 
     if (this.value.length > 150) { 
 
      return false; 
 
     } 
 
     else { 
 
      $("#remainingGeneralAgreementName").html("Remaining characters : " + (150 -  this.value.length)); 
 
     } 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="GeneralAgreementName" type="text"> 
 
<span id=remainingGeneralAgreementName></span>

來源

2017-05-08 15:36:04

仍然具有與OP狀態相同的確切問題 – epascarello

需要'keyup'實際上 –

不要return false當長度超過限制，它可以防止textarea的獲得任何輸入的。

或者：

截斷在事件處理程序的值，如果它太長
防止數據從時間過長的
設置文本字段的maxlength屬性，使其不可能被提交輸入字符太多

...只是不return false在事件處理程序，直到永遠。

此外，使用keyup和，而不是keypress：

$('#GeneralAgreementName').on('keyup keydown', function() ...

來源

2017-05-08 15:49:10

$（'＃GeneralAgreementName'）。on（'keyup keydown'，function（）{ 如果（this.value.length> 150）{ 。 //返回false;} 其他 { $（「＃remainingGeneralAgreementName」）HTML（「剩餘字符：」 +（150 - this.value.length））;} }）; – Tom

我刪除了返回false，但它允許我輸入比所需長度更多的charectors。我如何設置最大長度。我正在使用mvc剃鬚刀文本區域控制。設置maxlength沒有幫助 – Tom

@Tom我不熟悉剃刀，所以我不知道。你可以用'this.value = this.value.substring（0，150）;'（你以前用來'返回false'）自己截斷值。 –

HTML有一個maxlength屬性所以用它。這將使用戶不再添加更多的字符，不需要自己處理。現在，你應該監聽輸入事件，以便它捕獲當用戶鍵入或粘貼的內容。

$("[maxlength]").on("input", function() { 
 
    var inp = $(this), 
 
     sel = '[for="' + inp.attr('id') + '"].remaining', 
 
     remaining = parseInt(inp.attr("maxlength")) - inp.val().length; 
 
    $(sel).html(remaining + " characters remaining");  
 
}).trigger("input");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label for="test1">10</label><input type="textbox" maxlength="10" id="test1"><label for="test1" class="remaining"></label> 
 
<br/> 
 
<label for="test2">20</label><input type="textbox" maxlength="20" id="test2"><label for="test2" class="remaining"></label> 
 
<br/> 
 
<label for="test3">55</label><input type="textbox" maxlength="55" id="test3"><label for="test3" class="remaining"></label>

來源

2017-05-08 15:54:26 epascarello

單擊退格或刪除字符時剩餘字符不會遞減

回答

相關問題