2013-03-22 79 views
0

我声明2个下拉菜单如下:组取决于第一液滴的选择下拉第二框的值向下

<label for="select-choice-1" class="select">Customer Product Name</label> 
    <select name="select-choice-1" id="select-choice-1" onchange="selectTransport(this.value)"> 
     <option value="a">Polyvinyl Chloride</option> 
     <option value="b">Thermosetting</option> 
     <option value="c">Thermoplastic</option> 
    </select> 
    <label for="select-choice-2" class="select">SABIC Product ID</label> 
    <select name="select-choice-2" id="select-choice-2"> 
     <option value="A">1731-Black</option> 
     <option value="B">1731-Brown</option> 
     <option value="C">2345-Blue</option> 
    </select> 
     //js function 
function selectTransport(value){ 
    if(value==="Thermoplastic") 
    { 

     var theText = "2345-Blue"; 
$("#select-choice-2 option:contains(" + theText + ")").attr('selected', 'selected'); 


    }} 

不知何故下来未被使用this.How选择第二降可予自动选择使用jquery函数选择了第一个下拉值后第二个下拉的值?

+1

两个选择具有相同的编号 – 2013-03-22 07:36:52

回答

1

尝试

$(function(){ 
    $('#select-choice-1').change(function(){ 
     var sel = $(this).val(); 
     $('#select-choice-2').val(sel.toUpperCase()); 
    }); 
}); 

更新

DEMO

function selectTransport(value){ 
//value return a,b,c 
var val = $('#select-choice-1 [value="'+value+'"]').html();//.text() 
    if(val==="Thermoplastic"){alert('test'); 
    var theText = "2345-Blue"; 
    $("#select-choice-2 option:contains(" + theText + ")").attr('selected', 'selected'); 
    } 
} 
+0

我编辑了我的问题,并添加了,我在尝试,并且它不工作。 – user2185012 2013-03-22 08:48:52

+0

@ user2185012,检查更新后的代码 – 2013-03-22 09:06:16

+0

嗨Pragnesh,你的代码是做什么的,它突出显示2345蓝色在第二个下拉列表中,当我去看列表,但它不显示框中的值2345-蓝色。 – user2185012 2013-03-22 09:15:36

0
function selectTransport(value){ 
if(value==="Thermoplastic") 
{ 

    var theText = "2345-Blue"; 
$("#select-choice-2 option:contains(" + theText + ")").attr('selected', 'selected'); 
在上述函数值

将任一个,B,C不热塑性

所以

function selectTransport(value){ 
if(value==="c") 
{ 
    .... 
} 
0

通过使用您可以轻松地你任务的jQuery,下面是代码:

var ddlArray= new Array(); 
var ddl = document.getElementById('tierFormulaBase'); 
for (i = 0; i < ddl.options.length; i++) { 
    ddlArray[i] = ddl .options[i].text; 
} 

$("#tierChangeType").change(function (e) { 
    var e = document.getElementById("tierChangeType"); 
    var selectedValue = e.options[e.selectedIndex].value; 
    var selectedText = e.options[e.selectedIndex].text; 

    document.getElementById('tierFormulaBase').innerHTML = ""; 
    var src = document.getElementById('tierFormulaBase'); 
    var opt = document.createElement("option"); 
    if(selectedValue == 1) 
    { 
     opt.text = ddlArray[0]; 
     opt.value = selectedValue; 
    }else if (selectedValue == 2) 
    { 
     opt.text = ddlArray[1]; 
     opt.value = selectedValue; 
    } 
    else if (selectedValue == 3) 
    { 
     opt.text = ddlArray[2]; 
     opt.value = selectedValue; 
    } 
    src.add(opt); 
}); 

的现场演示和详细信息通过这个链接:click here to view code

相关问题