表单组件_小程序表单多行输入框表格详解

示例代码：

  </view>
<view class="section">
  <textarea placeholder="placeholder颜色是红色的" placeholder-style="color:red;"  />
</view>
<view class="section">
  <textarea placeholder="这是一个可以自动聚焦的textarea" auto-focus />
</view>
<view class="section">
  <textarea placeholder="这个只有在按钮点击的时候才聚焦" focus="{{focus}}" />
  <view class="btn-area">
    <button bindtap="bindButtonTap">使得输入框获取焦点</button>
  </view>
</view><view class="section">      <textarea placeholder="form 中的 textarea" name="textarea"/>    <button form-type="submit"> 提交 </button>  </view></pre><pre class="brush:js;toolbar:false;">//textarea.js
Page({
  data: {
    height: 20,
    focus: false
  },
  bindButtonTap: function() {
    this.setData({
      focus: true
    })
  },
  bindTextAreaBlur: function(e) {
    console.log(e.detail.value)
  },  bindFormSubmit: function(e) {    console.log(e.detail.value.textarea)  }
})</pre><p>Bug & Tip</p><ol class=" list-paddingleft-2"><li><p><code>bug</code>: 微信版本<code>6.3.30</code>，<code>textarea</code>在列表渲染时，新增加的<code>textarea</code>在自动聚焦时的位置计算错误。</p></li><li><p><code> tip</code>:<code>textarea</code> 的<code>blur</code>事件会晚于页面上的<code>tap</code>事件，如果需要在<code>button</code>的点击事件获取<code>textarea</code>，可以使用<code>form</code>的<code>bindsubmit</code>。</p></li><li><p><code>tip</code>: 不建议在多行文本上对用户的输入进行修改，所以<code>textarea</code>的<code>bindinput</code>处理函数并不会将返回值反映到<code>textarea</code>上。</p></li><li><p><code>tip</code>:<code>textarea</code>组件是由客户端创建的原生组件，它的层级是最高的。</p></li><li><p><code>tip</code>: 请勿在<code>scroll-view</code>中使用<code>textarea</code>组件。</p></li><li><p><code>tip</code>:<code>css</code>动画对<code>textarea</code>组件无效。</p></li></ol><p>相关文章：</p><p>微信小程序组件form表单解读和分析介绍</p><p>微信小程序之表单组件分享一</p><p>相关视频：</p><p>微信小程序开发文档<p>以上就是表单组件_小程序表单多行输入框表格详解的详细内容，更多请关注其它相关文章！</p>        <br>
        <script type="text/javascript">
            var cpro_id = "u6885494";

        </script>
        <script type="text/javascript" src="//cpro.baidustatic.com/cpro/ui/cm.js"></script>
    </div>


    <div class="blog_tags">
        <ul>
                        <li><a href="https://www.php1.cn/tag/xml" target="_blank" title="xml">xml</a></li>
                        <li><a href="https://www.php1.cn/tag/微信" target="_blank" title="微信">微信</a></li>
                        <li><a href="https://www.php1.cn/tag/css" target="_blank" title="css">css</a></li>
                        <li><a href="https://www.php1.cn/tag/小程序" target="_blank" title="小程序">小程序</a></li>
                    </ul>
    </div>



    <div class="article_cmnt" style="display: none;">
        <div class="cmnt_title">写下你的评论吧 !</div>
        <form action="" method="post">
            <div class="cmnt_text">
                <textarea class="ping-txt" onfocus="ck_txt(this);" onblur="ck_txt2(this);" id="ping-txt" name="ping-txt" >吐个槽吧,看都看了