【问题标题】:Difference between "maxlength" & "size" attribute in html?html中“maxlength”和“size”属性之间的区别?
【发布时间】:2014-10-04 12:49:49
【问题描述】:

我对@9​​87654322@ 和size 属性之间的区别有点困惑。

<input type="text" name="telephone" maxlength="30" size="34">

我知道maxlength是用来控制输入数据的。那么同时使用这两个属性的原因是什么?

【问题讨论】:

  • size 属性用于计算控件的显示大小。 max-length 限制了用户可以输入的字符数量(但仍然需要在服务器上进行验证)
  • @knittl,maxlength 属性没有连字符。 developer.mozilla.org/en-US/docs/Web/HTML/Element/Input
  • @Sparky:很好的收获。不幸的是,我不能再编辑我的评论了。

标签: html forms web


【解决方案1】:

maxlength(不是max-length)属性指定输入字符串的最大长度(以字符为单位,更准确地说,以代码单位为单位)。浏览器应通过拒绝接受更多字符来强制执行此操作。然而,这并不意味着作为一种安全措施,因为它可以被简单地覆盖。相反,它告诉用户在处理数据时不再接受字符。这在您必须设置上限时很有用,例如您的数据库只能存储固定数量的字符 fpr 某些信息,并且当长度存在逻辑限制时(例如,如果数据是美国州的两个字母代码,则其逻辑上限为 2 )。

maxlength 属性因此是合乎逻辑的,它甚至可以在非可视用户界面中工作。它不会以任何方式影响输入字段的视觉外观。

相比之下,size 属性仅用于视觉渲染。它建议字段的可见宽度,以“平均”字符表示。这个模糊的概念在规范中没有得到明确的说明,浏览器的实现也不一致。使用等宽字体时效果最佳。此属性不限制输入的字符数量,但会影响可用性:很难在一次只能看到 10 个字符的字段中输入 30 个字符长的字符串。字段的宽度也是给用户的一个信号:它表示输入的预期最大宽度。

通常适合使用这两个属性,通常具有相同的值。例如,如果该字段用于 5 位邮政编码,则 size=5 maxlength=5 是合适的,尤其是如果您还设置了 font-family: monospace,那么实际宽度或多或少正好是 5 位。

但是,这些值可能不同。例如,当询问邮政地址中的一行时,您可以设置size=30,因为这通常对于一行来说就足够了,但是maxlength=80,如果这对应于您的数据库或数据处理设置的限制并且您没有不允许这么长的行的特殊原因。

size 属性原则上可以替换为 CSS,因为它只处理视觉呈现。但是,宽度通常最好以字符为单位,CSS中没有普遍支持的字符平均宽度单位;新的 ch 单元很接近,但不完全相同,旧浏览器不支持。

【讨论】:

  • 为什么宽度“通常最好用字符设置”input 的 CSS width 不应以像素为单位设置,是否有充分的技术原因?
  • @Sparky,为了可用性,宽度应该反映“正常”输入的预期最大宽度,这通常可以最好地表述为多个字符。像素将是一个特别成问题的选择,因为字母的宽度因字母、字体系列和字体大小而异。
【解决方案2】:

max-length 用于指示输入字段中可以输入的字符数,无论屏幕上显示的字段有多大。 size 属性确定字段在屏幕上的宽度。

例如,我通常将其用于输入可能相当长的电子邮件地址之类的事情,但出于美学原因(良好的网页设计),您希望输入字段具有一定的长度。

&lt;input type="text" name="email" maxlength="50" size="20"&gt;

一旦用户为其电子邮件地址输入超过 20 个字符,该字段就会在他们键入时开始滚动。

【讨论】:

  • 如何防止用户看到他正在输入的整个地址?许多电子邮件地址的长度超过 20 个字符。
  • @JukkaK.Korpela,我认为在这种情况下,“好的设计”指的是符合特定布局(“出于审美原因”我>)。这部分是见仁见智的问题,但为了公平起见,他的解决方案 100% 正确回答了问题(第一段),所以我不认为投反对票是合理的,IMO。
  • 嗯,属性名称不是max-length,电子邮件地址也不是一个很好的例子,尤其是使用&lt;input type=email ...&gt; 可能更好阅读。
  • @JukkaK.Korpela,是的,我同意,这也是我没有投票的原因。
【解决方案3】:

最大长度是指输入字符串的最大可能长度。大小是指输入本身的大小。

【讨论】:

    【解决方案4】:

    size 属性可用于更改输入字段的大小(屏幕上字段的宽度),其中maxlength 属性可用于定义输入字段的最大字符数。

    【讨论】:

      【解决方案5】:

      size 是“屏幕上应该有多大”。 max-length 是浏览器允许在字段中输入的最大字符数。他们根本没有关系。如果你想成为一个虐待狂的页面设计师,你可以拥有size = 50 kajillion, max-length=1

      【讨论】:

      猜你喜欢
      • 2011-05-31
      • 1970-01-01
      • 2012-10-03
      • 2011-06-22
      • 2012-08-27
      • 2011-02-02
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多