Bu yazıda javascript ile select nesnelerini kullanarak bir tane jump menü tasarladık. Aşağıdaki kodları kopyalayıp test edebilirsiniz.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
<!doctype html> <html> <head> <title>www.algoritmaornekleri.com</title> <meta charset="utf-8"> </head> <body> <script> document.addEventListener("DOMContentLoaded", function(event) { var e = document.getElementById("jumpmenu"); e.addEventListener("change", function() { selectedURL = this.options[this.options.selectedIndex].value; if (this.value != "null") { var confirmLeave = confirm("Devam etmek istiyor musun?"); // Cevap Tamam ise if (confirmLeave==true) { document.location.href = selectedURL; } // Cevap İptal ise else { return false; } } }); }); </script> <form name="navForm" action=""> <select name="jumpmenu" id="jumpmenu"> <option>Sayfa Seç..</option> <option value="https://www.algoritmaornekleri.com">Algoritma</option> <option value="http://www.ahmetcansever.com">C# ve HTML</option> <option value="http://www.yazilimbilisim.net">C# HTML SQL CSS JS</option> </select> </form> </body> </html> |
