JSON本地文件中的HTML選擇選項

Question

在我的HTML頁面上，我希望有兩個選擇，一個用於選擇國籍，另一個用於選擇月份預訂，但是第一個選擇有太多選擇。 我設法獲得了一個具有所有國籍的json文件（看起來像這樣[{“ Code”：167，“ Nationality”：“ Russia”}，{“ Code”：98，“ Nationality”：“ Ireland”}，{“ Code“：14，” Nationality“：” Australia“}， ...），現在我需要一種簡單的方法來替換我的選擇選項。 HTML主體是這樣的：

<body onload="initialize()">
    <h1>Hotel Recommendations</h1>
    <h3>The Best Hotels in Europe</h3>

    <div id="currentText">We recommend the best hotels for you, based on your nationality and month of booking. 
        Do you want to give it a try?</div>
    <p></p>

    <form action = "/p/5433/newhotels" method ="POST">
        {% if error_message %}
          <div id="error"><p>{{error_message}}</p></div>
        {% endif %}

        <div id="floating-panel">
            <div>
                <select id="selector" name="nationality">
                    <option value="{{nationality}}" >Nationality</option>
                    <option value="80">Portuguese</option>
                    <option value="60">English</option>
                    <option value="55">Spanish</option>
                    <option value="65">Chinese</option>
                    <option value="30">French</option>
                </select>
            </div>
            <div>
                <select id="selector" name="month">
                    <option value="{{month}}" >Booking Month</option>
                    <option value="01">January</option>
                    <option value="02">February</option>
                    <option value="03">March</option>
                    <option value="04">April</option>
                    <option value="05">May</option>
                    <option value="06">June</option>
                    <option value="07">July</option>
                    <option value="08">August</option>
                    <option value="09">September</option>
                    <option value="10">October</option>
                    <option value="11">November</option>
                    <option value="12">December</option>
                </select>
                <input type="submit" value="Get Hotels">
            </div>
            <div>
                <select id="locality-dropdown" name="locality" onload="placeNationalities()"></select>
            </div>
        </div>
        <div id="all">
            <div id="mapid" style="width: 1200px; height: 600px;"></div>
            <div id="filters">
                <label for="fname">Number of Hotels</label>
                <input type="text" name="numberHotels" value={{numberHotels}} size="5">

                <label for="lname">MinAvg Rating</label>
                <input type="text" name="minAvgRat" value={{minAvgRat}} size="5">
            </div>
        </div>
    </form>
</body>

我也有一些

Answer 1

解決了html上的json內容！ 解決方案（減少了json）：

<body>
...
<div>
    <select id="selectorr" name="nationality">
    </select>
    <script>
        html = "";
        obj = [{"Code":167,"Nationality":" Russia "},{"Code":98,"Nationality":" Ireland "}]
        for (i=0; i<obj.length; i++) {
            html += "<option value=" + obj[i].Code  + ">" + obj[i].Nationality + "</option>"
        }
        document.getElementById("selectorr").innerHTML = html;
    </script>
</div>
...

JSON本地文件中的HTML選擇選項

問題描述

1 個解決方案

解決方案1
0 2018-06-03 16:15:53

JSON本地文件中的HTML選擇選項

問題描述

1 個解決方案

解決方案1 0 2018-06-03 16:15:53

解決方案1
0 2018-06-03 16:15:53