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