两个带按钮的下拉选项

Question

I am trying to get this work.

I have 2 dropdown lists. Once the user select the required value and click the button. The button will load specific URL based on the selected options in both the dropdowns.

https://jsfiddle.net/vs3q879c/

<script>
  $(document).ready(function() {

        OR = document.getElementById("orientation");
        SZ = document.getElementById("size");
        ORSZ = OR + SZ;




        switch (ORSZ) {
          case PA5:
            window.location.href = "www.xxxx.wwww/one.html";
            break;

          case PA4:
            window.location.href = "www.xxxx.wwww/two.html";
            break;

          case PA3:
            window.location.href = "www.xxxx.wwww/three.html";
            break;

          case LA5:
            window.location.href = "www.xxxx.wwww/four.html";
            break;

          case LA4:
            window.location.href = "www.xxxx.wwww/five.html";
            break;

          case LA3:
            window.location.href = "www.xxxx.wwww/six.html";
            break;

          default:
          default none();
        }

</script>

Answer 1

You have a few mistakes. Instead of using window.location.href , try using window.open("www.my-url.com") .

Also, you have 2 default statements in your switch clause , try something like this:

switch (ORSZ) {
    case PA5:
        window.location.href = "www.xxxx.wwww/one.html";
        break;

    case PA4:
        window.location.href = "www.xxxx.wwww/two.html";
        break;

    case PA3:
        window.location.href = "www.xxxx.wwww/three.html";
        break;

    case LA5:
        window.location.href = "www.xxxx.wwww/four.html";
        break;

    case LA4:
        window.location.href = "www.xxxx.wwww/five.html";
        break;

    case LA3:
        window.location.href = "www.xxxx.wwww/six.html";
        break;

    default: none();
}

Lastly, when you're getting the select elements by ID, you're grabbing the object instead of the selected value. To fix that, you need to use .value :

OR = document.getElementById("orientation").value;
SZ = document.getElementById("size").value;
ORSZ = OR + SZ;

DEMO: http://jsbin.com/tivocodeza/edit?html,js,output

Answer 2

Yeah, the above - grab the value of the input, not the element.

You are also using jQuery in your fiddle $(document).ready();

if you are doing that, you can use jQuery for everything. Not sure you want that but in case you do, here is a code suggestion:

$(document).ready(function() {
  $('#submit').click(function(e) {
    e.preventDefault();
    var ORSZ = $('#orientation').val() + $('size').val();

    switch (ORSZ) {
      case PA5:
      window.open("www.xxxx.wwww/one.html", '_blank');
    break;

    //e
    //t
    //c

  });
});

I added the id="submit" to your button to make it easier to select.