Question

我正在点击一个按钮实现这个Bootstrap Modal。但是点击按钮，屏幕上出现模态，每个字段都正确显示，除了textarea字段，它下面的按钮代码和文件上传代码，进入textarea，为什么会这样？请检查以下代码以获取模态：

<div class="modal fade" id="myModalContactt" role="dialog">
    <div class="modal-dialog">

        <!-- Modal content-->
        <div class="modal-content tuningModal">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body tuningModalTwo">
                <form action="/tuningModal/"  style="padding: 0% 7%;">
                    <h3>GET IN TOUCH WITH US</h3>
                    <div class="row form-group">
                        <label>Your Name(required)</label>
                        <input type="text" class="form-control" id="name" name="name"/>
                    </div>
                    <div class="row form-group">
                        <label>Email(required)</label>
                        <input type="email" class="form-control" id="email" name="email"/>
                    </div>
                    <div class="row form-group">
                        <label>Phone Number</label>
                        <input type="text" class="form-control" id="phone" name="phone"/>
                    </div>
                    <div class="row form-group">
                        <label>Car Brand</label>
                        <input type="text" class="form-control" id="carBrand" name="carBrand"/>
                    </div>
                    <div class="row form-group">
                        <label>Model</label>
                        <input type="text" class="form-control" id="model" name="model"/>
                    </div>
                    <div class="row form-group">
                        <label>Your Message</label>
                       <textarea rows="10"  class="form-control" id="message" name="message"/>
                    </div>
                    <div class="row form-group">
                        <label>Upload your software(Note:please upload in zip filetype)</label>
                        <input type="file" class="form-control-file" name="softUploadFile"/>
                    </div>
                    <div class="row form-group" style="margin-top:20px;margin-bottom:20px">
                        <button type="submit" class="btn btn-primary btn-block">Submit</button>
                    </div>
                </form>
            </div>

        </div>

    </div>
</div>

以下是按钮的代码，我已将数据目标和数据切换设置为此模态：

<div id="red_div2" class="row ">
    <h2 id="redtext2" class="wow bounceInRight">QUESTIONS OR INTEREST IN ANY OF OUR PRODUCTS? </h2>
    <button type="button" class="btn btn-info" id="AskYourQuestion" data-toggle="modal" data-target="#myModalContactt">
        ASK YOUR QUESTION
        <i class="fa fa-angle-double-right"></i>
    </button>

</div>

它在浏览器中显示如下：

Answer 1

关闭 textarea 标记

 <textarea rows="10"  class="form-control" id="message" name="message"/></texarea>

Answer 2

<textarea rows="10"  class="form-control" id="message" name="message"/>

textarea不是自动关闭标记（也称为 void element ）。

自闭标签允许标签本身的关闭部分，例如<input/>，而非自闭标签必须具有明确匹配的关闭标签，例如：

<textarea></textarea>

这些通常是标签内可能有内容的地方，例如

<textarea>appears inside the textarea</textarea>

规范中的更多信息：https://www.w3.org/TR/html5/syntax.html#writing-html-documents-elements

和https://stackoverflow.com/a/3558200/2181514

在textarea下面的代码进入textarea作为其值？

2 个答案: