相关疑难解决方法(0)

如何使用Prototype自动调整textarea?

我正在为我工​​作的公司开发一个内部销售应用程序,我有一个允许用户更改交付地址的表单.

现在我认为它会看起来更好,如果我用于主要地址细节的textarea只占用其中文本的区域,并在文本被更改时自动调整大小.

这是目前的截图.

ISO地址

有任何想法吗?


@克里斯

一个好点,但有理由我希望它调整大小.我希望它占用的区域是其中包含的信息区域.正如你在屏幕截图中看到的那样,如果我有一个固定的textarea,它会占用相当大的垂直空间.

我可以减少字体,但我需要地址大而且可读.现在我可以减小文本区域的大小,但是我遇到的问题是地址行需要3或4行(一行需要5行).需要用户使用滚动条是一个主要的禁忌.

我想我应该更具体一点.我正在垂直调整大小,宽度无关紧要.发生这种情况的唯一问题是,当窗口宽度太小时,ISO编号(大"1")会被推到地址下(正如您在屏幕截图中看到的那样).

这不是要有一个gimick; 它是关于有一个用户可以编辑的文本字段,它不会占用不必要的空间,但会显示其中的所有文本.

虽然如果有人想出另一种解决问题的方法,我也会对此持开放态度.


我已经修改了一些代码,因为它的行为有点奇怪.我将其更改为在keyup上激活,因为它不会考虑刚刚输入的字符.

resizeIt = function() {
  var str = $('iso_address').value;
  var cols = $('iso_address').cols;
  var linecount = 0;

  $A(str.split("\n")).each(function(l) {
    linecount += 1 + Math.floor(l.length / cols); // Take into account long lines
  })

  $('iso_address').rows = linecount;
};
Run Code Online (Sandbox Code Playgroud)

html javascript css textarea prototypejs

115
推荐指数
7
解决办法
13万
查看次数

如何设置文本区域的默认大小,但仍允许其根据用户的设备进行调整?

我正在尝试制作一个 5 行的文本区域,宽度默认为其下方容器的宽度,但如果用户使用小型移动设备(例如智能手机),也允许它变得更窄。我一直在研究,发现对于是否使用 CSS 还是 HTML 来改变文本区域的大小存在争议。我对网络开发相当陌生(从上周开始),所以如果您知道如何解决我的问题,您能告诉我为什么您选择了这种方法吗?

<form class="form-inline">

    <div class="form-group">

        <textarea class="form-control" rows="5"></textarea>

    </div>
</form>


<form class="form-inline">

  <div class="form-group">

    <label class="sr-only" for="exampleInputAmount">Amount (in dollars)</label>

    <div class="input-group">

      <div class="input-group-addon">$</div>
      <input type="text" class="form-control" id="exampleInputAmount" placeholder="Amount">

    </div>

  </div>

  <button type="submit" class="btn btn-primary">Send!</button>

</form>
Run Code Online (Sandbox Code Playgroud)

html css textarea

3
推荐指数
1
解决办法
1万
查看次数

标签 统计

css ×2

html ×2

textarea ×2

javascript ×1

prototypejs ×1