【问题标题】:How can I get my third party script to correctly function on my website?如何让我的第三方脚本在我的网站上正常运行?
【发布时间】:2019-01-04 12:10:28
【问题描述】:

当用户填写我的表格并点击“生成简历”按钮时。 HTML 表单应以 PDF 格式自动下载到用户下载文件夹。

问题一:

我尝试使用this 第三方插件,但无法使其正常运行,因为当我单击<a class"btn btn-circle btn-outline-brand" onclick="pdfmyform(this);" href="#">Generate CV</a> 按钮时没有任何反应。我怎样才能让它工作?

Inspect errors

问题二:

我怎样才能让这个按钮<a class"btn btn-circle btn-outline-brand" onclick="pdfmyform(this);" href="#">Generate CV</a> 看起来像<input class="btn btn-circle btn-outline-brand" type="submit" value="Generate CV"> 我确实使用了同一个类。但是,我认为引导程序中的类信息仅适用于 <input> 标记,那么我该如何解决这个问题呢?

以下是我当前的代码

     <!-- Form-->
     <section class="module bg-gray text-center divider-bottom p-3">
        <div class="container">
           <div class="row">
              <div class="col-md-12">
                 <form id="contact-form" method="post" novalidate>
                    <div class="row">
                       <div class="col-md-4">
                          <div class="form-group">
                             <input class="form-control" type="text" name="name" placeholder="Name (Click Me)" required="">
                             <p class="help-block text-danger"></p>
                          </div>
                       </div>
                       <div class="col-md-4">
                          <div class="form-group">
                             <input class="form-control" type="email" name="email" placeholder="E-mail (Click Me)" required="">
                             <p class="help-block text-danger"></p>
                          </div>
                       </div>
                       <div class="col-md-4">
                          <div class="form-group">
                             <input class="form-control" type="text" name="subject" placeholder="Mobile Number (Click Me)" required="">
                             <p class="help-block text-danger"></p>
                          </div>
                       </div>
                       <div class="col-md-12">
                          <div class="form-group">
                             <textarea class="form-control" name="message" placeholder="Education History (Click Me)" rows="12" required=""></textarea>
                          </div>
                       </div>
                       <div class="col-md-12">
                          <div class="form-group">
                             <textarea class="form-control" name="message" placeholder="Previous Employers (Click Me)" rows="12" required=""></textarea>
                          </div>
                       </div>
                       <div class="col-md-12">
                          <div class="form-group">
                             <textarea class="form-control" name="message" placeholder="Personal Skills / Hobbies (Click Me)" rows="12" required=""></textarea>
                          </div>
                       </div>
                       <div class="col-md-12">
                          <p></p>
                          <div class="text-center">
                             <input class="btn btn-circle btn-outline-brand" type="submit" value="Generate CV">
                             <a class"btn btn-circle btn-outline-brand" onclick="pdfmyform(this);" href="#">Generate CV</a>
                          </div>
                       </div>
                    </div>
                 </form>
                 <!-- Ajax response-->
                 <div class="ajax-response text-center" id="contact-response"></div>
              </div>
           </div>
        </div>
     </section>
     <!-- Form end-->

这是我放置第三方脚本的位置。

      <!-- Scripts-->
      <script src="assets/js/custom/jquery-3.2.1.min.js"></script>
      <script src="assets/js/custom/popper.min.js"></script>
      <script src="assets/js/bootstrap/bootstrap.min.js"></script>
      <script src="assets/js/custom/plugins.min.js"></script>
      <script type="text/javascript" src="http://www.pdfmyform.com/js/pdfmyform.js"></script>
      <script src="assets/js/custom/custom.min.js"></script>
</html>
</body>

如果需要,下面是完整的网页代码

 <!-- Form-->
         <section class="module bg-gray text-center divider-bottom p-3">
            <div class="container">
               <div class="row">
                  <div class="col-md-12">
                     <form id="contact-form" method="post" novalidate>
                        <div class="row">
                           <div class="col-md-4">
                              <div class="form-group">
                                 <input class="form-control" type="text" name="name" placeholder="Name (Click Me)" required="">
                                 <p class="help-block text-danger"></p>
                              </div>
                           </div>
                           <div class="col-md-4">
                              <div class="form-group">
                                 <input class="form-control" type="email" name="email" placeholder="E-mail (Click Me)" required="">
                                 <p class="help-block text-danger"></p>
                              </div>
                           </div>
                           <div class="col-md-4">
                              <div class="form-group">
                                 <input class="form-control" type="text" name="subject" placeholder="Mobile Number (Click Me)" required="">
                                 <p class="help-block text-danger"></p>
                              </div>
                           </div>
                           <div class="col-md-12">
                              <div class="form-group">
                                 <textarea class="form-control" name="message" placeholder="Education History (Click Me)" rows="12" required=""></textarea>
                              </div>
                           </div>
                           <div class="col-md-12">
                              <div class="form-group">
                                 <textarea class="form-control" name="message" placeholder="Previous Employers (Click Me)" rows="12" required=""></textarea>
                              </div>
                           </div>
                           <div class="col-md-12">
                              <div class="form-group">
                                 <textarea class="form-control" name="message" placeholder="Personal Skills / Hobbies (Click Me)" rows="12" required=""></textarea>
                              </div>
                           </div>
                           <div class="col-md-12">
                              <p></p>
                              <div class="text-center">
                                 <input class="btn btn-circle btn-outline-brand" type="submit" value="Generate CV">
                                 <a class"btn btn-circle btn-outline-brand" onclick="pdfmyform(this);" href="#">PDF this page!</a>
                              </div>
                           </div>
                        </div>
                     </form>
                     <!-- Ajax response-->
                     <div class="ajax-response text-center" id="contact-response"></div>
                  </div>
               </div>
            </div>
         </section>
         <!-- Form end-->

      <!-- Copyright -->
      <div class="footer-copyright text-center text-black py-3">© Copyright 2018 Handcrafted By Zeplur. All Rights Reserved |
         <a href="terms.pdf">Terms and conditions</a>
      </div>
      <!-- To top button--><a class="scroll-top" href="#top"><i class="fas fa-angle-up"></i></a>
      <!-- Scripts-->
      <script src="assets/js/custom/jquery-3.2.1.min.js"></script>
      <script src="assets/js/custom/popper.min.js"></script>
      <script src="assets/js/bootstrap/bootstrap.min.js"></script>
      <script src="assets/js/custom/plugins.min.js"></script>
      <script type="text/javascript" src="http://www.pdfmyform.com/js/pdfmyform.js"></script>
      <script src="assets/js/custom/custom.min.js"></script>
   </body>
</html>

【问题讨论】:

  • 只想指出你所有的lib都应该放在你自定义的js之前。所以, 会在 pdfmyform 之后.js 声明
  • 您是否在浏览器的检查视图中遇到某种错误?
  • 好的,谢谢,我现在更新一下,看看它是否有效。 @RaviKumarGupta 检查错误 > imgur.com/a/xv5FlPJ 可能是因为我现在在本地托管文件?
  • 有人可以帮忙吗?
  • 我想你需要正确地托管东西。您可以制作本地服务器并在那里托管内容。然后所有的脚本都应该可以工作了。

标签: html plugins


【解决方案1】:

看起来你的代码没问题。但是在检查视图中可以看到,错误清楚地表明无法加载本地资源。

问题 1 - pdfmyform() 不允许读取本地资源。

一旦您使用适当的网站或本地网络 (http) 服务器托管代码,这应该可以正常工作。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2019-01-28
    • 1970-01-01
    • 1970-01-01
    • 2012-11-04
    • 1970-01-01
    • 2015-06-16
    • 2017-07-15
    • 2020-06-22
    相关资源
    最近更新 更多