Bootstrap v3.3模态

Question

我正在努力学习如何从单独的HTML文件中显示模态内容。

这是 index.html 文件

中的按钮

<button type="button" class="btn btn-RAQ" data-toggle="modal" data-target="#RQF">
    <span><strong>REQUEST A QUOTE</strong></span> <i class="glyphicon glyphicon-check"></i>
</button>

我想加载这个模态内容

请求-A-quote.html

<!-- Modal -->
    <div class="modal fade" id="RQF" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h1 class="modal-title" id="myModalLabel">Request a Quote:</h1>
          </div>
          <div class="modal-body">

            <!-- RQF MAIN CONTENT -->
            <form id="contact-form" method="post" action="contact.php" role="form">

                    <div class="messages"></div>

                    <div class="controls contact-form">

                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>Full Name *</label>
                                    <input type="text" name="name" id="name" placeholder="" required>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>Company Name *</label>
                                    <input type="text" name="name" id="name" placeholder="" required>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>Email *</label>
                                    <input type="email" name="email" id="email" placeholder="" required>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>Phone *</label>
                                    <input type="phone" name="phone" id="phone" placeholder="" required>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>Interested In *</label>
                                    <select required>
                                          <option disabled selected value="">Please Select *</option>
                                          <option value="Digital Signage Solutions">Digital Signage Solutions</option>
                                          <option value="Interior Fit Out Works">Interior Fit Out Works</option>
                                          <option value="Custom Exhibition Stands">Custom Exhibition Stands</option>
                                          <option value="Civil Engineering & Contracting">Civil Engineering & Contracting</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>Attache File</label>
                                    <input type="file" id="Afile" accept=".jpg, .jpeg, .png, .pdf" max="1">
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label>Message *</label>
                                    <textarea name="message" id="message" placeholder="" required></textarea>
                                </div>
                            </div>
                            <div class="col-md-12">
                                 <input type="submit" name="submit" value="SEND" onClick="">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12">
                                <p class="text-muted"><strong>*</strong> These fields are required.</p>
                            </div>
                        </div>
                    </div>
                </form>
                <!-- END RQF MAIN CONTENT -->
            </div>
          </div>
        </div>
    </div><!-- ENBD Modal -->

可以这样做吗？因为如果我要更改我的请求报价表格，这将很容易。

我试图搜索，找不到任何答案，所以我在这里发布。任何帮助将不胜感激。