首页 > 解决方案 > 无法使用 ajax 提交帖子请求

问题描述

home.php 中的表单部分

<div id='googleForm'>
            <form>

              <div class='item'>
                <label class='label'>お名前&lt;/label>
                <input class='inputs' type='text' name='entry.1403582438' required>
              </div>

              <div class='item'>
                <label class='label'>メールアドレス&lt;/label>
                <input class='inputs' type='email' name='entry.920640653' required>
              </div>
              <div class='item'>
                <label class='label'>お電話番号&lt;/label>
                <input class='inputs' type='text' name='entry.1631209175' required>
             </div>

              <div class='item'>
                <p class='label'>お問合わせの種類</p>
                <div class='inputs'>
                <input id='cut' type='radio' name='entry.1757207008' value='1'><label for="cut">無料体験</label>
                <input id='cut-color' type='radio' name='entry.1757207008'  value='2'><label for="cut-color">料金</label>
                <input id='headspa' type='radio' name='entry.1757207008'  value='3'><label for="headspa">入会について</label>
                <input id='other' type='radio' name='entry.1757207008'  value='4'><label for="other">その他&lt;/label>

                </div>
              </div>

              <div class='item'>
                <label class='label'>お問合わせ内容&lt;/label>
                <textarea class='inputs' name='entry.669414687' required></textarea>
              </div>

              <div class='btn-area'>
                <input type='submit' value='送信'><input type='reset' value='リセット'>
              </div>

            </form>
        </div>

home.php中的ajax部分

<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
    <script>
      $(function() {
        $('#googleForm').submit(function(e){

                let hostUrl = "https://docs.google.com/forms/u/0/d/e/1FAIpQLSfuXJf8bjE4cYO5f_5g4w-CW0R_LXruvaNG1-veDiEwFh0fEg/formReisponse";
                let name = $('input:text[name="entry.1403582438"]').val();
                let email = $('input[name="entry.920640653"]').val();
                let contact = $('input:text[name="entry.1631209175"]').val();
                let category_id = $('input:radio[name="entry.1757207008"]:checked').val();
                let inquiry = $('textarea[name="entry.669414687"]').val();
                $.ajax({
                   url: "https://docs.google.com/forms/d/e/1FAIpQLSfuXJf8bjE4cYO5f_5g4w-CW0R_LXruvaNG1-veDiEwFh0fEg/viewform?usp=pp_url",
                   type: "POST",
                   data: { "entry.1403582438": name, "entry.920640653": email, "entry.1631209175": contact, "entry.1757207008": category_id, "entry.669414687": inquiry},
                   dataType: "xml",
                   statusCode: {
                        0: function() {

                        },
                        200: function() {

                        }
                   }
                });

         e.preventDefault();
        });
      });
    </script>

我想使用 ajax 向 Google 表单提交发布请求。

为什么我要使用 ajax 是因为期望网页在提交 post 请求时不会转换到 Google Form。

问题是在提交请求时,它总是以控制台面板上出现如下错误而告终。

在此处输入图像描述

我不知道该怎么做才能解决这个问题。

如果您分享您的知识,我将非常高兴。

标签: javascriptphpajax

解决方案


解决了。问题只是我为 url 变量设置了错误的值。将其更正为适当的,发布请求已正确提交到 Google 表单。

另外,将“数据类型”从“xml”更改为“jsonp”时,解决了以下一直存在的错误

'' ' 从源 ' http://xs858158.xsrv.jp '访问XMLHttpRequest被 CORS 策略阻止:请求的资源上不存在“Access-Control-Allow-Origin”标头。'''


推荐阅读