如何显示弹出如果选择“选项”在“选择”下拉使用JavaScript？

Question

1. 如果我选择Option1它显示弹出

2. 如果我选择Option2它必须证明以下选择框消息在页面

3. 如果我选择Option3它显示的iframe页面

如何达到上述目的？

Answer 1

<script> 
    $(document).ready(function(){ 
    $(':input#mysel').live('change',function(){ 
    var sel_opt = $(this).val(); 
    alert(sel_opt); 
    if(sel_opt==1) 
    { 
     your code; 
    } 
    else if(sel_opt==2) 
    { 
     your code; 
    } 
     else if(sel_opt==3) 
     { 
     your code; 
     } 

    }); 

}); 
    </script> 
    <select id="mysel"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
    </select>` 

Answer 2

使用jQuery的.change()

例如：

HTML：

<select name="sel1" id="sel1"> 
    <option value="1">popup</option> 
    <option value="2">message</option> 
    <option value="3">iframe</option> 
</select> 

的javascript：

jQuery('#sel1').change(function() { 
    if(jQuery(this).val() == "1") { 
     //popup code 
    } 
}); 

当然，这EXA mple仅显示第一种情况，您可以使用switch作为三个（或更多）选项。

Answer 3

我假设“如果选择”选项“在”选择“下拉使用JavaScript”你的意思是“当用户选择一个特定的选项，我想用JavaScript来做其他事情发生”。

这应该让你开始：

$("#IDofYourSelect").change(function() { 
    switch ($(this).val()) { 
    case "Option1": 
     alert("I don't know what you mean by 'popup', but do that here."); 
     break; 
    case "Option2": 
     // show message below select 
     break; 
    case "Option3": 
     // do your iframe thing 
     break; 
    } 
}); 

如果你想更具体的你应该让你的问题（很多）更清晰的东西。

Answer 4

我假设你的意思是这样的：

HTML：

<select id="selection"> 
    <option value="1">Option 1</option> 
    <option value="2">Option 1</option> 
    <option value="3">Option 1</option> 
</select> 

的Javascript

$(function() { 
    $("#selection").change(function() { 
     var val = $(this).val(); 

     if (val == 1) { 
      // ... 
     } 
    }); 
}); 

Answer 5

我上的jsfiddle为你写。 http://jsfiddle.net/BgGTH/1/

Answer 6

只是处理下拉的onchange：

$("#DropDown1").bind("change", function() { 
    var value = this.value; 
    switch (value) { 
     case "Value1": 
      window.open("MyPage.html", "myPage"); 
      break; 
     case "Value2": 
      $("#MyMessage").show(); 
      break; 
     case "Value3": 
      $("#MyFrame").show(); 
      break; 
    } 
}); 

这应该指向你在正确的方向。