JS實現限制正文框元件正文長度

1.1 版本

1.2 應用場景

在實際填報程式中，對於單據類的編號的填報，可能編碼為標準格式，有固定的長度，例如手機號碼，固定 11 位數。

在填報此類內容時，當欄位超過特定的值時，需要設定提醒。如下圖所示：

1.3 實現思路

正文框元件 新增「編輯後」事件，實時監視當前正文框中正文長度。

如果長度大於設定的長度，彈窗提醒且正文框中只保留符合長度規範的內容。

方法一直接在 JS 中使用固定數字校驗正文長度。

2.1 建立範本

建立一張普通報表。如下圖所示：

2.2 新增元件

為 A1 儲存格新增正文元件。如下圖所示：

2.3 新增事件

選中 A1 儲存格，點選「元件設定>事件」，新增一個「編輯後」事件，在每輸入一個字元後觸發，即每輸入一個字元，就對目前正文框的長度進行一次校驗。如下圖所示：

JavaScript 程式碼如下：

注：當需要校驗的資料的長度有變化時，修改 JS 中校驗長度的數字即可。

var data=this.getValue();
//獲取到儲存格的值
var len=data.length;
//判斷值的長度
if(len>7)
{
_g().setCellValue("A1",data.substr(0,7));
//如果儲存格值長度超過7位,就截取前7位重新指派給正文框
//A1為報表中元件所在儲存格位置
alert("最長為7位");//彈窗顯示
}

方法二首先設定一個範本參數，再在 JS 中使用此參數校驗正文長度。

3.1 建立範本

同 2.1 節，此處不再贅述。

3.2 新增元件

同 2.2 節，此處不再贅述。

3.3 新增參數

新增一個範本參數maxlen，設定預設值。如下圖所示：

注：當需要校驗的資料的長度有變化時，修改範本參數的預設值即可。

3.4 新增事件

選中 A1 儲存格，點選「元件設定>事件」，新增一個「編輯後」事件，事件中新增參數，在每輸入一個字元後觸發，即每輸入一個字元，就對目前正文框的長度進行一次校驗。如下圖所示：

JavaScript 程式碼如下：

var data=this.getValue();
//獲取到儲存格的值
var len=data.length;
//判斷值的長度
if(len>Number(maxlen))
{
_g().setCellValue("A1",data.substr(0,Number(maxlen)));
//如果儲存格值長度超過maxlen位,就截取前maxlen位
//A1為報表中元件所在儲存格位置
alert("最長為"+Number(maxlen)+"位");
}

注：不支援行動端。

方法一、方法二的預覽效果相同。

儲存範本，選擇「填報預覽」，效果如 1.2 節所示。

點選下載方法一範本：方法一JS中固定數字.cpt

點選下載方法二範本：方法二使用參數.cpt