0

私はjsonコードの初心者です。誰かがこのエラーで私を助けてくれれば幸いです:私は車のモデル+年+預金+価格を持っています

ユーザーが最初にモデルをクリックして年とデポジットを選択すると、毎月の金額が表示されます。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Cars</title>
<link href="css/cakeform.css" rel="stylesheet" type="text/css" />
<script>
var prices = {
'model' : 'Skoda' {
'1' : {
    '12300' : '959',
    '13000' : '892',
    '13500' : '844',
    '19000' : '317'
},
'2' : {
    '12300' : '542',
    '13000' : '504',
    '13500' : '477',
    '19000' : '179'
},
'3' : {
    '12300' : '403',
    '13000' : '375',
    '13500' : '355',
    '19000' : '133'
}
};
    'Tiida' {
'1' : {
    '12300' : '955',
    '13000' : '892',
    '13500' : '844',
    '19000' : '317'
},
'2' : {
    '12300' : '555',
    '13000' : '504',
    '13500' : '477',
    '19000' : '179'
},
'3' : {
    '12300' : '455',
    '13000' : '375',
    '13500' : '355',
    '19000' : '133'
}
};
};
  onload = function(){
var f = document.booklets;
var model = f.model;
var qtyEl = f.qty;
var pagesEl = f.pages;
var priceEl = document.getElementById('price');
f.qty.onchange = f.pages.onchange = f.model.onchange = function(){
    var qty   = qtyEl[qtyEl.selectedIndex].value;
    var model = modelEl[modelEl.selectedIndex].value;
    var pages = pagesEl[pagesEl.selectedIndex].value
    priceEl.innerHTML = prices[pages][qty][model];
};
f.qty.onchange();//initialise price field for whatever values are selected on page   load
 };
 </script>
 </head>
 <body>

 <fieldset>
 <legend>Cars</legend>
 <form name="booklets" method="" action="">
<div>Select Model:
<select class="selectClass" name="model">
    <option value="Skoda">Skoda</option>
    <option value="Tiida">Tiida</option>
    <option value="Tyota">Toyota</option>
</select>
<div>Select Year:
<select class="selectClass" name="pages">
    <option value="1">1 Year</option>
    <option value="2">2 Years</option>
    <option value="3">3 Years....</option>
</select>
<br><br>Select Deposit:
<select class="selectClass" name="qty">
    <option value="12300">$12300</option>
    <option value="13000">$13000</option>
    <option value="13500">$13500</option>
</select>
   </div>
   <div><br>Monthly Payment: <font color="blue" size=7>$ <span id="price"></span> </font>       </div>
  </form>
 </fieldset>
 </body>
 </html>

前もって感謝します：

4

1 に答える 1

1

あなたの JSON は有効ではなかったため、修正する必要がありました。有効な JSON"の代わりに使用し、 JSONLintのようなものを使用して、不適切なコンマとブラケットをチェックする必要があります。'

修正された JSON 変数:

var prices = {
    "Skoda": {
        "1": {
            "12300": "959",
            "13000": "892",
            "13500": "844",
            "19000": "317"
        },
        "2": {
            "12300": "542",
            "13000": "504",
            "13500": "477",
            "19000": "179"
        },
        "3": {
            "12300": "403",
            "13000": "375",
            "13500": "355",
            "19000": "133"
        }
    },
    "Tiida": {
        "1": {
            "12300": "955",
            "13000": "892",
            "13500": "844",
            "19000": "317"
        },
        "2": {
            "12300": "555",
            "13000": "504",
            "13500": "477",
            "19000": "179"
        },
        "3": {
            "12300": "455",
            "13000": "375",
            "13500": "355",
            "19000": "133"
        }
    }
};

その後、コードに 1 つまたは 2 つのタイプミスがあり、JSON データに正しくアクセスしていませんでした。構造内の階層に基づいてアクセスできるようにする必要があります。ここでは、つまりprices[model][pages][qty].

固定onload機能:

window.onload = function() {
    var f = document.booklets;
    var modelEl = f.model;
    var qtyEl = f.qty;
    var pagesEl = f.pages;
    var priceEl = document.getElementById('price');
    f.qty.onchange = f.pages.onchange = f.model.onchange = function () {
        var qty = qtyEl[qtyEl.selectedIndex].value;
        var model = modelEl[modelEl.selectedIndex].value;
        var pages = pagesEl[pagesEl.selectedIndex].value;
        priceEl.innerHTML = prices[model][pages][qty];
    };
    //initialise price field for whatever values are selected on page   load
    f.qty.onchange(); 
};

デモ: http://jsfiddle.net/eGQr2/

于 2013-08-25T09:24:06.637 に答える