0

可能重复：
JQuery/Javascript 如何使用 Get 解析 HTML

我有以下正在运行的代码：

$.getJSON('json/shares.json', function(data) {
var items = [];

$.each(data.Shares, function(key, val) {
items.push('<option id="' + val.shareName+ '">' + val.shareName+ '</option>');
});

  $('<select/>', {
    'id': 'shares_select',
    html: items.join('')
  }).appendTo('#shares');
});

$.get('lon_shares.html', function(data){     
$(data).appendTo('#shares');  
});

这将使用 JSON 文件创建一个下拉列表。我需要它在进行选择时自动提交，然后获取相关的 html 文件，所以如果他们从下拉列表中选择“lon”，则文件为“lon_shares.html”，如果他们选择“par”，则为“par_shares.html”并且很快。

我是 JQuery 和 Javascript 的新手，所以请举例说明它的外观，包括我的代码，谢谢。

4

2 回答 2

1 
//Suppose this is the html
<select id="share-list">
</select>

<div id="shares">
</div>

//this should be in script tag
$.getJSON('json/shares.json', function(data) {
    //This clears previous items in the dropdown
    $("select#share-list").html('')

    $.each(data.Shares, function(key, val) {
        $("select#share-list").append('<option value="' + val.shareName+ '">' + val.shareName+ '</option>');
    });

});

//Binding a change event to the dropdown
$("select#share-list").change(function(e) {
    var el = $(e.currentTarget);
    var share_name = el.attr('value');
    var page = share_name+'.html';

    $.get(page, function(data){     
        $(data).appendTo('#shares');  
    });
});
于 2012-09-30T11:02:04.797 回答
1

您可以在选择框更改时触发表单提交。

 $.getJSON('json/shares.json', function(data) {
        var items = [];
        $.each(data.Shares, function(key, val) {
               items.push('<option id="' + val.shareName+ '">' + val.shareName+ '</option>');
          });
        $('<select/>', {
          'id': 'shares_select',
          html: items.join('')
         }).appendTo('#shares')
         .change(function(){    
              $('form').trigger('submit');         
               $.get( this.value +'_shares.html', function(data){     
                     $(data).appendTo('#shares');  
               });
         });
});
于 2012-09-30T10:55:34.107 回答