时间戳

首页 > 解决方案 > 如何限制html中的字符串长度

javascript - 如何限制html中的字符串长度

问题描述

我有一个 html 网页，它捕获一个人的地址名字和姓氏。单击提交按钮时，在文本区域中，它将显示输入的名字和姓氏的地址实际上我对文本字段进行了 50 个字符的限制。但是如果有人给出一个小地址，整个内容就会向左移动。我想要正确的 alignmnet 中的所有条目

例如，如果我给了 2 个输入，

  1. fname-kiran,lname-bhal,adrress- Kiran Bhavan,Pune 2.fname-nanditha,lname-das,adrress- NANDITHA,tc10/10,street 11,Pune

我得到的输出

  1. 请查找 Kiran Bhavan 的地址，Pune of Kiran Bhal
  2. 请找到 NANDITHA,tc10/10,street 11,Pune of Nanditha Das 的地址

两者不在同一对齐

我想要的输出是

在此处输入图像描述

所有人的 fname、lname 和地址都在同一位置。

如果地址很小，用空白填充剩余的空格

代码是

<!DOCTYPE html>
<html>
<head>
<script>
    function IV() {
        var fname = document.getElementById("fname").value;          
        var lname = document.getElementById("lname").value;
        var address= document.getElementById("address").value;
        var result = 'Please find the address of' +address+'of                   '+fname' 
        '+lname
        document.getElementById('spanResult').textContent = result;
         
       }

     </script>


     </head>
       <header>
         <h1>SNA fname - IV</h1>
     </header>
     <body> 
     <table> 
       <form >
           <tbody> 
            <tr> 
                <td align="middle" colspan="2"> 
                </td> 
            </tr> 
            <tr> 
                <td width="24%" style="width: 20%"> 
                   First name :
                </td> 
                <td> 
                    <input id="fname" size="30" name="fname" />
                </td> 
                <td width="9%"> 
                </td> 
              </tr> 
              <tr> 
                <td style="width: 20%"> 
                    Last name: 
                </td> 
                <td> 
                    <input id="lname" size="30" name="lname" /> 
                </td> 
            </tr> 
           <tr> 
                <td style="width: 20%"> 
                    Address: 
                </td> 
                <td> 
                    <input id="address" size="30" name="address" /> 
                </td> 
            </tr> 
               
        </tr> 
        </tbody> 
       </table> 
    
      </form >
      <button  onclick=

"IV()"  >IV</button> <br />
      <textarea id="spanResult" rows="10" cols="200"></textarea>    
      </body>
      </html>

标签： javascripthtmlstringstring-length

解决方案

推荐阅读