Question

可能重复：
JQuery/Javascript how to Parse HTML using a Get

我有以下代码正在运行：

$.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的新手，所以请举例说明如何查看我的代码谢谢。

Answer 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');  
               });
         });
});

Answer 2

//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');  
    });
});

JQuery Autosubmit Dropdown

2 个答案: