Question

使用TextArea，class =＆＃34; materialize-textarea＆＃34;。在https://materializecss.com/forms.html的文档中，TextArea不需要javaScript或jQuery向下扩展并随之移动页面内容。

当我在TextArea中输入文本时，我无法按Enter键向下移动。我只能沿着这条线写到无限。这不是我想要的，显然，我想要的是TextArea在文本到达行尾时调整大小，但它没有。有没有人遇到过这个问题？

HTML: 
<div class="container" id="applyDiv">
    <h4 class="header center green-text">APPLY FOR MEMBERSHIP</h4>
    <div class="row">
        <form class="col s12">
            <div class="row">


                <p class="light">
                    By submitting your company details you can get access to StoryTourist and create your own 
                    customized stories for your audience to enjoy around the world!
                </p>
                <div class="input-field col s12">
                    <i class="material-icons prefix green-text">business</i>
                    <input placeholder="Company Name" type="text" class="validate">
                </div>
                <div class="input-field col s12">
                    <i class="material-icons prefix green-text">mail outline</i>
                    <input placeholder="Company e-mail" type="text" class="validate">
                </div> 
                <div class="input-field col s12">
                    <i class="material-icons prefix green-text">phone</i>
                    <input placeholder="Company phone-number" type="text" class="validate">
                </div> 
                <div class="input-field col s12">
                    <i class="material-icons prefix green-text">mode_edit</i>
                    <input placeholder="Message us..." textarea id="textArea1" class="materialize-textarea"></textarea>
                </div>


            </div>
        </form>
    </div>        
    <div class="row center padding-bottom-1">
        <a class="btn-small green" id="sendButton">Submit details</a>
    </div>
</div>

更新

已更改：

<input placeholder="Message us..." textarea id="textArea1" class="materialize-textarea"></textarea>

致：

<textarea placeholder="Message us..." textarea id="textArea1" class="materialize-textarea"></textarea>

现在面临的问题是页面没有动态更改TextArea，我的CSS中没有固定的高度。

Answer 1

您需要更改此

<input placeholder="Message us..." textarea id="textArea1" class="materialize-textarea"></textarea>

到此

<textarea placeholder="Message us..." id="textArea1" class="materialize-textarea"></textarea>

这应该可以解决您的问题。您使用<input>标记打开，但使用</textarea>标记关闭。

Answer 2

我知道这真的很晚，但是当您下载Materialize文件夹时-如果您希望它自动调整大小，materialize将使用javascript，因此您必须同时包含javascript文件和css文件

Materialize TextArea没有动态变化？

2 个答案: