Add link to select option when clicked

Hi there,

I have a select dropdown which I am adding some new options to via jQuery. What I would like to do is to send the user to a URL when the select option is clicked.

I’ve managed to add the options, but can’t work out how to make the link go to the URL in the value.

$('select[name="ap"]').append($('<option>', {value:'', text:'Google'}));    
$('select[name="ap"]').append($('<option>', {value:'', text:'Google UK'}));    
$('select[name="ap"]').append($('<option>', {value:'', text:'Google FR'}));    

Any ideas how I can do this?


Like this:

    <meta charset="utf-8">
    <title>Select onChange</title>

    <select name="ap">
      <option>Please choose an option</option>

    <script src=""></script>
      const $select = $('select[name="ap"]');
      const opts = [
        {'value':'', 'text':'Google'},
        {'value':'', 'text':'Google UK'},
        {'value':'', 'text':'Google FR'}

        $("<option />", {
          value: obj.value,
          text: obj.text

      $select.on("change", function(){
        window.location = this.value;

Also, maybe consider tidying up the code that appends the elements to the select?

Many thanks :slight_smile: It workled

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.