jQuery的问题与在CSS中添加

Question

在这里我有工作其中一个正在按预期

jsfiddle.net/beaconhill/khcgmm1n/ 

但同样的，当我增加了一些自定义的CSS和努力实现这是行不通的一样多drodpown预计

jsfiddle.net/beaconhill/5aj1z42z/ 

Answer 1

您需要触发from选择要更新第二选择选项的变化，你需要时刻更新变化的列表。

检查工作小提琴：http://jsfiddle.net/5aj1z42z/15/

创建仅列出一次，并随时更新相关的选择：

// This makes my prett dropdown list 
$('select').each(function() { 

// Hides the select element 
    $(this).addClass('s-hidden'); 

    // Wrap the select element in a div 
    $(this).wrap('<div class="select"></div>'); 

    // Insert a styled div to sit over the top of the hidden select element 
    $(this).after('<div class="styledSelect"></div>'); 

    updateList($(this)); 

}); 

触发第二个列表

$listItems.click(function(e) { 
    e.stopPropagation(); 
    $styledSelect.text($(this).text()).removeClass('active'); 
    $this.val($(this).attr('rel')); 
    $list.hide(); 

    $this.trigger('change'); 
    /* alert($this.val()); Uncomment this for demonstration! */ 
    }); 

更新漂亮的改变列表视图中的更改功能

function fromAirportChanged() { 
    var routes = getRoutes(_airports[this.value]); 

    $("#" + _settings.toId).find('option').remove(); 
    $("#" + _settings.toId).append("<option></option>"); 

    for (var i = 0; i < routes.length; i++) { 
     $("#" + _settings.toId).append("<option>" + routes[i].To + "</option>"); 
    } 

    //_settings.toAirportsChanged(); 

    updateList($("#" + _settings.toId)); 
    };