Spaces:
Running
Running
| <html lang="it"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Random Picker Webapp</title> | |
| <style> | |
| body { | |
| font-family: 'Arial', sans-serif; | |
| margin: 20px; | |
| } | |
| #randomPickerForm { | |
| margin-bottom: 20px; | |
| } | |
| input[type="text"] { | |
| display: block; | |
| margin: 10px 0; | |
| padding: 10px; | |
| width: 100%; | |
| } | |
| button { | |
| padding: 10px 20px; | |
| background-color: #4CAF50; | |
| color: white; | |
| border: none; | |
| cursor: pointer; | |
| } | |
| button:hover { | |
| background-color: #45a049; | |
| } | |
| #results { | |
| margin-top: 20px; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <form id="randomPickerForm"> | |
| <div id="categories"> | |
| <input type="text" id="category1" placeholder="Categoria 1 (opzioni separate da virgola)"> | |
| <input type="text" id="category2" placeholder="Categoria 2 (opzioni separate da virgola)"> | |
| <input type="text" id="category3" placeholder="Categoria 3 (opzioni separate da virgola)"> | |
| <input type="text" id="category4" placeholder="Categoria 4 (opzioni separate da virgola)"> | |
| <input type="text" id="category5" placeholder="Categoria 5 (opzioni separate da virgola)"> | |
| </div> | |
| <button type="button" id="randomSelectButton">Scegli Casualmente</button> | |
| </form> | |
| <div id="results"> | |
| </div> | |
| <script> | |
| document.getElementById('randomSelectButton').addEventListener('click', function() { | |
| var results = []; | |
| for (var i = 1; i <= 5; i++) { | |
| var categoryInput = document.getElementById('category' + i).value; | |
| if (categoryInput) { | |
| var options = categoryInput.split(','); | |
| var randomIndex = Math.floor(Math.random() * options.length); | |
| results.push(options[randomIndex].trim()); | |
| } else { | |
| results.push('Nessuna opzione per la Categoria ' + i); | |
| } | |
| } | |
| document.getElementById('results').innerHTML = 'Risultati: <br>' + results.join('<br>'); | |
| }); | |
| </script> | |
| </body> | |
| </html> | |