Go to another url when clicked

I need to create an html code in which if the user selects an item from the drop-down list and click the button, he will go to the corresponding link.

<select name="myList"> <option value="Google" />Google <option value="yahoo" />yahoo <option value="Ask" />Ask </select> 

if the user selects the Google drop-down list and clicks the button, the page should be redirected to the www.google.com page, and if she selects yahoo and click the button, go to www.yahoo.com

I would like to mention that I need a button in this scenario. I do not want to go to the appropriate site with a drop-down choice. Only after pressing a button.

Thanks in advance.

+6
source share
5 answers

HTML:

 <select name="myList" id="ddlMyList"> <option value="http://www.google.com">Google</option> <option value="http://www.yahoo.com">Yahoo</option> <option value="http://www.ask.com">Ask</option> </select> <input type="button" value="Go To Site!" onclick="NavigateToSite()" /> 

JavaScript:

 function NavigateToSite(){ var ddl = document.getElementById("ddlMyList"); var selectedVal = ddl.options[ddl.selectedIndex].value; window.location = selectedVal; } 

You can also open the site in a new window by following these steps:

 function NavigateToSite(){ var ddl = document.getElementById("ddlMyList"); var selectedVal = ddl.options[ddl.selectedIndex].value; window.open(selectedVal) } 

As a side note, your parameter tags are not formatted properly. You should never use the <... / "> label if the tag contains content.

+6
source

First, change the parameter values ​​to the URL you want to target:

 <option value="http://www.google.com">Google</option> <option value="http://www.yahoo.com">Yahoo</option> <option value="http://www.ask.com">Ask</option> 

Then add an identifier to select so you can customize it:

 <select name="myList" id="myList"> 

Finally, add the onclick method to the select control to handle the redirect:

 <input type="button" onclick="document.location.href=document.getElementById('myList').value"> 
+5
source
 <select name="myList"> <option value="http://www.google.com">Google</option> <option value="http://www.yahoo.com">Yahoo</option> <option value="http://www.ask.com">Ask</option> </select> <input type="button" onclick="window.location=document.myList.value" /> 
+2
source

Using JavaScript, you can attach an onclick event to a button. In the event handler, you can use the if to check which value was selected in the select list, and use window.location to redirect the user to the corresponding URL.

I would suggest changing the value of the option elements as a required URL, and you can just get the value and go to that URL instead of checking which option was selected.

+1
source
 onclick()="window.location.href='page.html'" 
-4
source

Source: https://habr.com/ru/post/890765/


All Articles