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 来检查选项是否正确附加？

其次，您可以使用 aconsole.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 回答