步驟 1
從元件庫拖一個文本域元件到畫布上，就是輸入段落那個元件（漢化后翻譯是文本域，比較專業(yè)，可能正常人回不太能理解。但是翻譯是死的，人是活的是不是）。然后單擊元件，在右側(cè)樣式下面給這個元件命名一下，我命名的叫“輸入框”，大家看心情吧，反正不協(xié)作的話怎么命名沒人管得著你。接下來，雙擊輸入框，輸入提示文字，文字樣式調(diào)整一下，顏色設(shè)置成999999。
步驟 2
現(xiàn)在，拖一個矩形元件，放到輸入框的左下角。把矩形狂的邊框線寬度設(shè)置為0，背景也設(shè)置為空白就行。然后按照步驟1的方法給矩形命名，我管他叫計數(shù)，因為這個矩形起到了顯示輸入框最大輸入限制和統(tǒng)計當(dāng)前輸入的字數(shù)的作用。
步驟 3
接下來，雙擊輸入框，給輸入框添加事件。一共添加兩個事件。事件1是文本改變時框輸入時限制文本框的輸入為500字，并統(tǒng)計當(dāng)前輸入的文字個數(shù)。事件2是獲取文本框焦點時，清空當(dāng)前的提示文字。由于當(dāng)前文本框沒有提示語的屬性，因此只能用這種方式做成輸入時清空提示語的交互。
然后按照圖示為當(dāng)前的元件也就是文本框，添加一個局部變量。
添加完成后，點擊添加函數(shù)或變量，選擇剛才添加的局部變量，然后再選擇字符串函數(shù)length。
然后，選擇完函數(shù)后，在函數(shù)后面加上/500。下圖是設(shè)置完成后的樣子。這個函數(shù)設(shè)置的，就是下方右側(cè)圖示展示的內(nèi)容。這個函數(shù)設(shè)置的含義是，獲取當(dāng)前的元件，也就是輸入框文本的字符長度，也就是獲取你在輸入框里輸入了多少個字。然后/500是限制輸入長度是500字的意思。所以結(jié)合下來就是下方右側(cè)圖示的文字輸入字數(shù)限制提示的樣式。
現(xiàn)在能獲取你當(dāng)前輸入的字數(shù)了，也顯示了當(dāng)前可輸入的字數(shù)是500字。接下來，就要設(shè)置如何限制你的輸入不超過500字了。還說選擇輸入框，然后添加動作，選擇設(shè)置文本，然后元件，選擇輸入框。上一次選擇的是計數(shù)，這一次選擇輸入框。上一次是因為要設(shè)置顯示當(dāng)前輸入字數(shù)和最大輸入字數(shù)，這一次設(shè)置是要限制你在文本框里輸入的字符數(shù)，所以要選擇文本框，千萬不要搞錯！。
跟之前一樣，設(shè)置函數(shù)，點擊fx去設(shè)置函數(shù)。然后與下方中間的圖所示一樣，先添加局部變量。然后選擇插入函數(shù)或變量，添加剛才添加的局部變量，上面有教怎么添加，不在贅述了。這次添加完局部變量后，再添加一個字符串函數(shù)：substring。見下方最右邊的圖。是substring不是substr，別搞錯了。我看的教程就用的substr，結(jié)果有bug，沒法輸入文字，會自動清空輸入框。。。后來我去找的函數(shù)，換成了substring就好了。教程誠是坑我，所以我才寫教程。。。廢話少說，添加完函數(shù)后。如圖，把函數(shù)里（）里的from和to改成你要截取的字符串的范圍。我改成了（0，500），意思是，不管文本框里輸入多少字，我只顯示從第一個到第500個字。從而達到限制輸入的效果。到此，字數(shù)限制的交互就結(jié)束了
然后剛才不是有個事件2嗎，事件2是一個獲取焦點時的事件。獲取焦點時，設(shè)置文本框的文本，這個文本設(shè)置上面都有教，大家復(fù)習(xí)一下。然后值呢，空著就行。原本咱們文本是寫了提示文案嗎，你再瀏覽器單擊時獲取了焦點，就會執(zhí)行這個獲取焦點時的事件，然后把文本設(shè)置為空，就達到了咱們的交互目的。
承擔(dān)因您的行為而導(dǎo)致的法律責(zé)任，
本站有權(quán)保留或刪除有爭議評論。
參與本評論即表明您已經(jīng)閱讀并接受
上述條款。