積沙成塔

當Textbox的TextMode屬性設定為MultiLine時可以允許使用者輸入多列文字訊息到Textbox，若希望使用者輸入的列數符合Rows所設定的數量時，可以利用JavaScript來達成這個需求，說明如下：

• 以下程式碼示範將TextBox設定為允許多列，且列數預設為5列。

   1:   <asp:TextBox ID="TextBox1" runat="server" Rows="5" 

   2:      TextMode="MultiLine" Width="100%"></asp:TextBox>        

預設使用者可以輸入超過5列的文字，如上圖所示。

• 以下程式碼示範透過JavaScript來限制使用者，輸入若超過Textbox的Rows則直接return。

   1:  <script type="text/javascript">

   2:          var keynum, rows = 1;

   3:   

   4:          function CheckRows(obj, e) {

   5:              // for IE

   6:              if (window.event) {

   7:                  keynum = e.keyCode;

   8:                  // for Netscape/Firefox/Opera

   9:              } else if (e.which) {

  10:                  keynum = e.which;

  11:              }

  12:   

  13:              if (keynum == 13) {

  14:                  if (rows == obj.rows) {

  15:                      return false;

  16:                  } else {

  17:                      rows++;

  18:                  }

  19:              }

  20:          }

  21:  </script>

• 最後在修改Textbox如下，就可以順利限制Textbox的最高列數。

   1:   <asp:TextBox ID="TextBox1" runat="server" Rows="5" TextMode="MultiLine" 

   2:              Width="100%"  onkeydown="return CheckRows(this, event)"></asp:TextBox>        

 

• 執行結果如下：

 

【參考資料】

• Limiting number of lines in textarea，StackOverFlow
• http://social.msdn.microsoft.com/Forums/zh-TW/236/thread/96cee330-5c99-4bc8-98b9-1a1c782dee16/