jQuery依赖选择选项

我试图做3连接与jQuery选择选项，我有麻烦与第三选择。我不明白为什么doesen't不考虑城市价值，这是出现选择箭头，但不是选择。jQuery依赖选择选项

这里我的代码使用jQuery：

$(document).ready(function() { 

//Initializing arrays with city names 
var USA = [ 
    {display: "Washington, D.C.", value: "WashingtonDC"}, 
    {display: "Alaska", value: "Alaska"}, 
    {display: "New York", value: "New-York"}, 
    {display: "Florida", value: "Florida"}, 
    {display: "Hawaii", value: "Hawaii"}, 
    {display: "California", value: "California"}]; 

var AUSTRALIA = [ 
    {display: "Canberra", value: "Canberra"}, 
    {display: "Sydney", value: "Sydney"}, 
    {display: "Melbourne", value: "Melbourne"}, 
    {display: "Perth", value: "Perth"}, 
    {display: "Gold Coast ", value: "Gold-Coast"}]; 

var FRANCE = [ 
    {display: "Paris", value: "Paris"}, 
    {display: "Avignon", value: "Avignon"}, 
    {display: "Strasbourg", value: "Strasbourg"}, 
    {display: "Nice", value: "Nice"}]; 

//REGION 

//Function executes on change of first select option field 
$("#country").change(function() { 

    var select = $("#country option:selected").val(); 

    switch (select) { 
     case "USA": 
      city(USA); 
      break; 

     case "AUSTRALIA": 
      city(AUSTRALIA); 
      break; 

     case "FRANCE": 
      city(FRANCE); 
      break; 

     default: 
      $("#city").empty(); 
      $("#city").append("<option>--Select--</option>"); 
      break; 
    } 
}); 

var ONE = [ 
    {display: "One", value: "One2"}, 
    {display: "Two", value: "Two2"}]; 

var TWO = [ 
    {display: "Three", value: "Three2"}, 
    {display: "Four", value: "Four2"}]; 

var THREE = [ 
    {display: "Five", value: "Five2"}, 
    {display: "Six", value: "Six2"}]; 


//Function executes on change of second select option field 
$("#city").change(function() { 

    var select = $("#city option:selected").val(); 

    switch (select) { 
     case "ONE": 
      region(ONE); 
      break; 

     case "TWO": 
      region(TWO); 
      break; 

     case "THREE": 
      region(THREE); 
      break; 

     default: 
      $("#region").empty(); 
      $("#region").append("<option>--Select--</option>"); 
      break; 
    } 
}); 

//Function To List out Cities in Second Select tags 
function city(arr) { 
    $("#city").empty();//To reset cities 
    $("#city").append("<option>--Select--</option>"); 
    $(arr).each(function (i) {//to list cities 
     $("#city").append("<option value=\"" + arr[i].value + "\">" + arr[i].display + " </option>") 
    }); 
} 

    //Function To List out Cities in Second Select tags 
function region(arr) { 
    $("#region").empty();//To reset cities 
    $("#region").append("<option>--Select--</option>"); 
    $(arr).each(function (i) {//to list cities 
     $("#region").append("<option value=\"" + arr[i].value + "\">" + arr[i].display + " </option>") 
    }); 
} 
});

第三选择doesen't采取的对象，有人知道为什么吗？感谢

JSFIDDLE

来源

2014-12-23 WolF

'city'的值是'WashingtonDC'等，但是在$（'＃city'）。change（）'处理程序中，您正在查找值''ONE'，''TWO'或'“三”“，这将永远不会匹配。所以你打默认情况下，清空'地区'选择。 –

城市的'select'元素的价值是城市的名称，而不是''一个“”两个“或”三个“' – AdityaParab

我要说var select = $（”＃city option：selected“ ）.VAL（）;选择华盛顿...但保罗说这一切 – Geomorillo

你只有ONETWO和THREE那里。没有一个是匹配的城市名称。我认为你只是忘记将它们设置为正确的值而不是占位符。

来源

2014-12-23 15:55:33

您正在阅读city值以显示区域。

您的代码假定city的值将为ONE，TWO或THREE但它从来不是这样。

因此，您始终可以应用default城市值。

来源

2014-12-23 15:55:48

这里的问题： Wrong Value Switching

从你所看到的，你给了错误的值，switch语句，因此代码不执行。

来源

2014-12-23 15:57:01 ykbks

从我所看到的失败的选择必须#REGION为由于城市功能#city将充满了城市的名字，如尼斯，巴黎，所以当

$('#city').change()

运行它通常会因为Nice或Paris以及第一个数组中指定的其他值都不是'ONE'，'TWO'或'THREE'，因此输入默认值。

我不明白你对地区和城市的意图，因为每个国家都有某些城市，但不是每个城市的某些地区，你的逻辑在这里是有缺陷的，不要担心它的共同点，但你必须认真思考并注意你在做什么。要更好地理解$（'＃city'）中的变化，请使用console.log（select）;运行它并检查您的控制台，您将看到第二个选择的值将永远不会是“一个”，“两个”或“三个”，因此将始终在您的默认声明的基础上创建一个空选择

来源

2014-12-23 16:01:45 zardilior

逻辑不是很重要...这是一个例子。地区可以是其他区域，我感兴趣的是我在城市变更后通过一组价值:) – WolF

我的意思是在第二个开关中更改“巴黎”的'ONE'，运行它，你会明白我的意思。（显然选择法国在第一选择和巴黎在第二个） – zardilior

是的作品！所以我需要为不同地区做很多声音...... – WolF

jQuery依赖选择选项

回答

相关问题