2017-01-17 5 views
1

上で作業を行い、私のワードプレスのウェブサイト上 footer.phpワードプレスではJavaScriptの作品はPC上ではなく、モバイル

var myForm = document.getElementById("questionnaire"); 
if (myForm) { 
    myForm.onsubmit = function() { 
var questionDiv = document.getElementById('question-div'); 
var busyDiv = document.getElementById('busy'); 
var resultDiv = document.getElementById('result-div'); 
var resultList = document.getElementById('result-list'); 
var xhr = new XMLHttpRequest(); 
var url = "https://script.google.com/macros/s/xxxxx/exec"; 
xhr.open("POST", url, true); 
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 

xhr.onload = function() { 
    if(xhr.readyState == 4 && xhr.status == 200) { 
    var response = JSON.parse(xhr.responseText); 
    var result = response.result; 
    for (var i in result) { 
     var e = result[i]; 
     if (e) { 
     var li = document.createElement('li'); 
     if (e.url) { 
      var a = document.createElement('a'); 
      a.href = e.url; 
      a.textContent = e.name; 
      li.appendChild(a); 
     } else { 
      li.textContent = e.name; 
     } 
     resultList.appendChild(li); 
     } 
    } 
    busyDiv.hidden = true; 
    resultDiv.hidden = false; 
    } 
} 

var form = document.getElementById('questionnaire'); 
var formData = new FormData(form); 
var fields = ['name','email','yob','gender','xxx','yyyy']; 
var params = []; 
for (var i in fields) { 
    var field = fields[i]; 
    params.push(field + "=" + formData.get(field)); 
} 
xhr.send(params.join('&')); 

questionDiv.hidden=true; 
busyDiv.hidden=false; 


return false; 
    }; 
} 
</script> 

これは私が書き、引用することができましたGoogleのシートからのデータ

これはすべてPC上で動作しますが、モバイルサイトでは404エラーが見つかりません。ウェブサイト自体はモバイルレスポンスに設定されています。

誰か助けてもらえますか?

ジェーン

+0

ページ自体は404ですか?そうであれば、フッターのJavascriptとは何の関係もありません。 AJAXクエリがモバイルやデスクトップでも異なる動作をすることは珍しいようです。 – dave

+0

このスクリプトやウェブページの何かがモバイルブラウザで問題を引き起こしているかどうかを知るためには、これをテストする必要があります。このフィドルリンクに移動し、#questionnaireフォーム要素を貼り付けて、結果を確認してコードをテストします:https://jsfiddle.net/h9pxkucr/ –

+0

@dave:ページは正常ですので、idはデータを入力してsubmitをクリックします。ページは404にリフレッシュされます... – Jane

答えて

0

あなたのフォームはどのように見えますか?私は、あなたのモバイルブラウザが非AJAXの方法でフォームを送信しようとしていると思われますので、あなたのフォームの "アクション"属性のURLにブラウザを誘導しています。このデフォルトの動作を停止するには、次の操作を実行してください。

var myForm = document.getElementById("questionnaire"); 
if (myForm) { 
    myForm.onsubmit = function(evt) { 
    evt.preventDefault(); 
+0

ねえ、あなたが正しいと思います。 PCのhtmlはモバイルのhtmlとは異なります。モバイルのhtmlはすべてのデータ入力を含みます。このコードを追加すると、モバイル上のページは404に入りますが、一度このコードを追加しています。 .... – Jane

+0

ページはコードを実行してGoogleシートからデータをロードすることになっていますが、代わりに – Jane

+0

のwww.fintrezを送信する前と変更していないままです。あなたは電話で確認してからあなたが見ることができます... – Jane

関連する問題