Wie auf URL-Links der Schaltflächen ändern, je nachdem, was in der zweiten Dropdown-

Question

HTML

<select id='A' name='A'> 
     <option value='Andorra' selected='selected'>Andorra 
     <option value='Switzerland'> Switzerland 
      <option value='Wyoming'> Wyoming, USA 
    </select> 
    <select id='B' name='B'> 
    </select> 
    <div> 
     <button onclick="window.location='http://www.google.com';">Button1</button> 
     <button onclick="window.location='http://www.facebook.com';">Button2</button> 
    </div> 

JavaScript

ausgewählt ist

(function() { 

    var bOptions = { 
    "Andorra": ["A"], 
    "Switzerland": ["B", "V", "G"], 
    "Wyoming": ["D", "DJ", "E", "ZH", "Z", "I", "J"] 
    }; 

    var A = document.getElementById('A'); 
    var B = document.getElementById('B'); 


    A.onchange = function() { 

    B.length = 0; 

    var _val = this.options[this.selectedIndex].value; 

    for (var i in bOptions[_val]) { 

     var op = document.createElement('option'); 

     op.value = bOptions[_val][i]; 

     op.text = bOptions[_val][i]; 

     B.appendChild(op); 
    } 
    }; 

    A.onchange(); 

})(); 

Nach dem, was in dem ersten Dropdown-Auswahl ausgewählt wird, Auswahlmöglichkeiten von Das zweite Dropdown wird geändert. Ich brauche Hilfe, um URL-Verknüpfungen von Schaltflächen zu ändern, basierend auf dem, was in der zweiten Dropdown-Liste ausgewählt ist. Hier

ist jsfiddle Link: http://jsfiddle.net/tcfsj2m9/2/

Answer 1

Wenn Sie Zugriff auf jQuery haben dies ist extrem einfach. Zuerst würde ich die <buttons> zu <a target="_blank"> Tags ändern, so dass wir die href wechseln können.

$("#A").change(function(){ 
// remove all previous options for #B and reset your buttons 
$("#B").find('option').remove(); 
$(".button-1").attr('href', 'http://google.com'); 
$(".button-2").attr('href', 'http://yahoo.com'); 
// Add the new option(s) to #B based on what was selected in #A 
$("#B").append('<option data-button1="{the_URL_you_want}" data-button2="{the_URL_you_want}">The Value</option>'); 
}) 
$("#B").change(function(){ 
    // Add the new options to the buttons 
    $(".button-1").attr('href', $(this).selected().data('button1')); 
    $(".button-2").attr('href', $(this).selected().data('button2')); 
});