2016-11-05 13 views
-1

私は内部に<script type="application/json"></script>というhtmlファイルを持っています。 htmlファイルが読み込まれる前に、このスクリプト内のjsonオブジェクトを変更する必要があります。それをどうやってやりますか?私はquestionOptions、質問、および国際[メッセージ] [質問]をランダム化するが、それらはすべて自分の与えられたインデックスで一致のと同じ方法でそれらをランダム化する必要が実行前にhtmlファイル内のアプリケーション/ jsonスクリプトを変更するにはどうすればよいですか?

<script type="application/json"> 
     {  
      "questionOptions": { 
       "ques_1": {"type" : "YesNoQuestion","questionText": "messages.questions.1"}, 
       "ques_2": {"type" : "YesNoQuestion","questionText": "messages.questions.2"}, 
       "ques_3": {"type" : "YesNoQuestion","questionText": "messages.questions.3"}, 
       "ques_4": {"type" : "YesNoQuestion","questionText": "messages.questions.4"}, 
       "ques_5": {"type" : "YesNoQuestion","questionText": "messages.questions.5"} 
      }, 
      "questions": [ 
       "ques_1", 
       "ques_2", 
       "ques_3", 
       "ques_4", 
       "ques_5" 
      ], 
      "persist": false, 
      "intl": { 
       "locales": "en-US", 
       "messages": { 
        "questions": { 
         "1": "<img src='../images/img1.jpg'>", 
         "2": "<img src='../images/img2.jpg'>", 
         "3": "<img src='../images/img3.jpg'>", 
         "4": "<img src='../images/img4.jpg'>", 
         "5": "<img src='../images/img5.jpg'>" 
        }, 
        "yes": "Similar", 
        "no": "Old", 
        "dragAndDrop": "<br><span class='preq'>Is the object old or similar?</span><br>Starting dragging the button down to see the picture. Drag and drop to your answer.", 
        "continue": "Click Next to continue", 
        "next": "Next", 
        "back": "Back", 
        "finish": "Finish", 
        "thankYou": "Thank you for completing this form." 
       } 
      } 
     } 
    </script> 

:JSONオブジェクトは、これに似たものになりますアレイを相互に接続する。

大変助かります。

編集:一致する引用符が追加されました。

+0

まず最初は、あなたのJSONを修正され、それは無効です。次に、自分でコードを書く必要があります。スタックオーバーフローはコード作成サービスではありません。私はあなたが始めるのに役立つ答えを追加します。 – Tibrogargan

+0

JSONはどのように無効ですか? – ParkerWilliams

+0

それをコピーしてオンラインのJSONバリデーターに貼り付けると、問題が表示されます。最初に、 'type =" application/json "' – Tibrogargan

答えて

1

ここではいくつかの考え:

  1. あなたが最初の場所でJSONを生成し、何を管理している場合を除き、物事に前にhtmlファイルのロードをランダム化する方法は本当にありません、I示されているように、推測はハードコードされています。

  2. questionOptionsおよびmessagesはハッシュです。それらのキーの順序は関係ありません。したがって、キーがどのように挿入されて配置されるかをランダム化するという点はありません。

  3. 最後に、questionsは配列がある - これはおそらくあなたがランダム化したい唯一のものです

はここだ(そして、できればこの配列順序に基づいてUI上で行うことにいくつかのレンダリングがありますか?)あなたは、配列のプロトタイプに追加できるコードの小片:

Array.prototype.shuffle = function() { 
    var j, x, i; 
    for (i = this.length; i; i--) { 
     j = Math.floor(Math.random() * i); 
     x = this[i - 1]; 
     this[i - 1] = this[j]; 
     this[j] = x; 
    } 
    return this; 
} 

そして、あなたは、あなたがランダム化したい任意の配列、例えば上でそれを呼び出すことができます。

qdata.questions.shuffle(); //assuming you store that JSON in a variable called qdata 
+0

HTMLの読み込みの前に、単に '

-1

ライブデータにJSONのスクリプトブロックをオンにし、文書がロードされる前に、元のJSONを変更する方法の小さな例:あなたがする必要がある

<script type="application/json">{"foo":"bar"} 
 
</script> 
 
<script> 
 
function randomizeData(data) { return { foo: "something else" }; } 
 
var data; 
 
(function() { 
 
    var scripts = document.getElementsByTagName("script"); 
 
    for(var i = 0; i < scripts.length; i++) { 
 
    if (scripts[i].type === "application/json") { 
 
     data = JSON.parse(scripts[i].innerText); 
 
     // manipulate/randomize your data here 
 
     data = randomizeData(data); 
 
     // change the JSON source to whatever you like 
 
     scripts[i].innerText = JSON.stringify(data); 
 
     break; 
 
    } 
 
    } 
 
})(); 
 

 
document.write("The value of foo: "+data.foo); 
 
</script> 
 
<body> 
 
</body>

関連する問題