1

私はこのHTMLコードを持っています:

<form action="" name="weatherpod" id="weatherpod" method="post">
<label for="destinations">Destination</label><br />
<select id="destinations" onChange="">
<option value="empty">Select Location</option>
</select>
<div id="location">
</div>
</form>

オプションは、JSON ファイルを介して作成されます。

$.getJSON('json/destinations.json', function(data) {
    destinations = data['Destinations']
    $.each(data.Destinations, function(i, v) {
        $('#destinations').append('<option value="' + v.destinationID + '">' +  v.destinationName + '</option>');
    })
});

div#locationユーザーが選択を行ったら、HTML ファイルから要素をプルしたいと考えています。

これは私が試したことです：

$("#destinations").change(function() {
    $("#location").load("/raw_html/" + $(this).val() + "_weather.html #body table");
});

ただし、これは機能しません。私はjQueryの初心者なので、助けていただければ幸いです。

ありがとう

私が試してみました：

$.getJSON('json/destinations.json', function(data) {
    destinations = data['Destinations']

    $.each(data.Destinations, function(i, v) {
    $('#destinations').append('<option value="' + v.destinationID + '">' + v.destinationName + '</option>');
        var URL = "/raw_html/" + v.destinationID + "_weather.html"
        console.log(URL);
        $("#location").load(URL);
    })
    $("#destinations").change(function() {
    $("#location").load(URL);
 });

 });

そして、正しい URL がコンソール ログに追加されます。どうすれば onChange イベントに追加できますか? ご協力いただきありがとうございます

4

1 に答える 1

0

まず、Firebug を使用して、オプションが正しく追加されていることを確認しましたか?

次に、 を使用しconsole.logて、変更が開始され、ファイル名が適切に作成されていることを確認できます。この段階では、次を使用する方が明確かもしれません。

var URL = "/raw...
console.log(URL);
$("#location").load(URL);

また、Chrome を使用している場合は機能しません (最初のコメントを参照)。

更新しました：

// Loop through appending destinations, but remove the rest from the `each` loop.
$.each(data.Destinations, function(i, v) {
    $('#destinations').append('<option value="' + v.destinationID + '">' + v.destinationName + '</option>');
});

// Add a change handler for #destinations
$("#destinations").change(function() {
   // When #destinations changes, create the URL using the option value that has been selected
   var URL = "/raw_html/" + $(this).val() + "_weather.html";
   console.log(URL); // Just to check
   $("#location").load(URL);

   // If it's working fine, you can just do this in one line
   // $("#location").load("/raw_html/" + $(this).val() + "_weather.html");
});
于 2013-08-17T22:52:53.807 に答える