2. 程式人生 > >js動態約束文字框錄入文字長度大小

js動態約束文字框錄入文字長度大小

阿新 • • 發佈：2018-12-24 
 <script type="text/javascript">
        var Count = 0;
        function CountStrByte(Message, Total, Used, Remain) { //位元組統計
            var ByteCount = 0;
            var StrValue = Message.value;
            var StrLength = Message.value.length;
            var MaxValue = Total;
            if
 
 (Count != StrLength) { // 在此判斷，減少迴圈次數
                for (i = 0; i < StrLength; i++) {
                    ByteCount = ByteCount + 1;
                    if (ByteCount > MaxValue) {
                        Message.value = StrValue.substring(0, i);
                        alert("最多不能超過 " + MaxValue + " 個字元！\n"
 
);
                        ByteCount = MaxValue;
                        break;
                    }
                }
                Used.innerText = ByteCount;
                Remain.innerText = MaxValue - ByteCount;
                Count = StrLength;
            }
        }
        function initPage
 
() {
            CountStrByte(document.all.txtRemark, document.all.total.innerText, document.all.used, document.all.remain)
        }
    </script>
<body onload="initPage()">
<table>
<tr class="contentAlign">
                    <td>備註</td>
                    <td colspan="5">
                        <asp:TextBox ID="txtRemark" runat="server" Style="width: 98%; height: 80px; margin-top: 5px; font-size: 12px;" TextMode="MultiLine"
                            onkeyup="CountStrByte(document.all.txtRemark,document.all.total.innerText,document.all.used,document.all.remain)"
                            onkeypress="CountStrByte(document.all.txtRemark,document.all.total.innerText,document.all.used,document.all.remain)"></asp:TextBox>
                        <br />
                        <div style="color: Gray;">
                            &nbsp;最多可輸入 <span style="color: Red;" id="total" name="total">250</span>個字，
                      您已經輸入 <span style="color: Red;" id="used" name="used">0</span> 個字元，
                      還可以輸入<span style="color: Red;" id="remain" name="remain"> 250 </span>個字元。
                        </div>
                    </td>
                </tr>
</table>
</body>

這裡寫圖片描述

相關推薦

js動態約束文字框錄入文字長度大小

<script type="text/javascript"> var Count = 0; function CountStrByte(Message, Total, Used, Remain) { //位元組統計 va

EXT文字框TextField輸入長度和內容控制

                1.限制輸入長度Ext.form.TextField 的 maxLength/size 處理的並不是很好，設定了maxLength後還是可以任意輸入，國外extjs論壇看到有人的帖子，通過prototype重定義這兩個屬性，試了一下，很有效Java程式碼 Ext.form.Te

個人js學習細節- 實現點選按鈕複製文字框中文字到剪下板中的方法

主要程式碼： <textarea name="text" id="text" cols="30" rows="10"></textarea> <button onclick="myCopy()">點選複製文字框內的內容</button><br

Ext.Net/ExtJs：關於TextField控制元件內size、maxLength控制文字框輸入字元長度屬性失效問題分析以及解決方案

今天發現這樣一個關於Ext.Net內TextField文字框設定屬性MaxLength、Size、MaxLengthText均失效問題，設定了此屬性，依然可以無限制地輸入文字資訊。無奈之餘，網上搜索

js手動聚焦輸入框或者文字域_focus

當一個頁面或者一個塊區域開啟的時候，需要把焦點放在使用者習慣使用的輸入框的時候，使用。 舉例如下： <input type="text" id="xxxxx"/> $('#xxxxxx')

VUE.js動態設定輸入框disabled屬性

需求背景 頁面從list列表展示，跳轉到新增和修改的時候，新增和修改用的是同一個頁面：add-or-update.vue。 修改的時候使用者的賬號不能修改，因此需要將賬號的輸入框屬性設定為"只讀"。 程式碼樣例 <el-input v-model="dataFor

ie8下文字框內文字垂直居中

今天測試又遇到了個ie8bug： 就是在ie8下設定了高度的input框內的文字不會自動垂直居中，而在其他瀏覽器及ie9+都正常，大家可以試一下. 解決方法就是像p標籤一樣設定一下行高，如：line-

iOS文字框 UITextField 文字框內設定不能輸入空格

1.首先先遵循UITextField 的代理方法  UITextFieldDelegate 2.實現代理方法 -(BOOL)textField:(UITextField *)textField shouldChangeCharactersInRange:(NSRa

MFC--設定靜態文字框的文字的字型、大小和顏色

1、放置Static控制元件 2、控制元件關聯控制變數，m_static（不是Value，是Control），注：先改變下ID，就可以正常關聯變數 3、宣告變數 CFont m_Font; 4、在初始化對話方塊中設定如下程式碼 //設定St

js給文字框動態繫結onblur方法，失焦的時候觸發

//以下以失焦時，去掉文字框對應值的前後空格為例；此外存在區域性重新整理元素也適應，區域性重新整理後再呼叫此方法即可。 var funMap = {};//記錄頁面變動之前的所有元素原始onblur方

JS實現簡單的判斷文字框長度

有點點JS基礎的人都可以看得明白，那麼就不多說，直接上程式碼 JS程式碼如下 function chargeid() { var x, text; x=document.logi

js將字串作為函式名呼叫，實現input文字框等form表單元素回車鍵統一事件響應

  通過給文字框<input enterKey=“fnName” />設定enterKey=“fnName”，頁面載入完後會自動繫結input的keydown事件，捕捉到回車鍵則呼叫fnName函式，如select等其它form元素也可以。要實現form表單元素回車鍵統一事件響應

JS 控制文字框禁止輸入例子

JS 控制不能輸入特殊字元 　　 <input type="text"class="domain"onkeyup="this.value=this.value.replace(/[^u4e00-u9fa5w]/g,'')"； this.value=this.value.replace(/[^u

js如何實現不能文字框貼上

1.onpaste 2.在angular中有一指令 AngularJS ng-paste 指令   指令詳解 運用當前指令 在貼上時執行方法彈出對話方塊 清空文字框 <!DOCTYPE html>

Js獲取下拉框當前選擇項的文字和值

　現在有一個Id為AreaId的下拉框，要獲取它當前選擇項的文字和值有以下方法： <span class="red">* </span> 地&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

JS-將文字框獲取的內容顯示在網頁上

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body>

js把頁面明細行資料多個欄位組成陣列，並獲取某個欄位值最大和其次大的資料賦值到文字框;

要求：前臺新增頁面的明細行中，有列下拉框選擇分類和一列付款金額的輸入框，明細行上面有兩個輸入框，要求在明細行選擇的分類和付款金額中篩選付款金額之和第一高的的分類和金額、第二高的分類和金額自動複製到上面的兩個輸入框中； 思路：迴圈明細表，把所有的明細表的分類和付款金額放到json陣列中，然後迴圈j

JS前臺頁面驗證文字框非空

效果圖： 程式碼： 原始碼： <script type="text/javascript"> function check(){    var xm = document.getElementById("xm").value;    if

前臺頁面JS驗證文字框非空，數值範圍選擇，單選框必選，複選框必選

前臺頁面JS驗證文字框非空，數值範圍選擇，單選框必選，複選框必選 <script type="text/javascript">function check(){   var xm = document.ge

JS 以及JQuery 獲取文字框，單選按鈕的值

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <me