ToutSurTout.biz / Sélecteur aléatoire

Loic · Discussion postée le 30-09-2012 à 16:45:18

Voici un petit script qui pourrait vous être utile pour si vous créez des concours, vous entrez les pseudos des inscrits, vous les séparez par une virgule. Un clic sur Sélection aléatoire et cela affichera un pseudo sélectionné aléatoirement parmi votre liste.

Un screen sera plus parlant.

Voici la source HTML (créez un simple fichier html)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Sélecteur aléatoire</title>
<meta name="keywords" content="aléatoire">
<style type="text/css">
fieldset input {
display: block;
}
#result {
border: solid 1px black;
background: #e0e0e0;
padding: 1em;
margin: 1em 0;
}
#ajax-loader {
display: none;
margin-bottom: -4px;
}
</style>
</head>

<body>
<h1>Sélecteur aléatoire</h1>
<p>Directives :</p>
<ol>
<li>Listez vos éléments dans le cadre ci-dessous</li>
<li>Séparez les d'une virgule</li>
<li>Cliquez sur Sélection aléatoire</li>
<li>Visualisez le résultat dans le cadre en bas</li>
</ol>
<form method="get" action="/" onsubmit="return false;">
<fieldset>
<textarea style="width:500px;height:100px;" name="things" id="things">élément 1, élément 2, élément 3, élément 4, élément 5</textarea>
</fieldset>
<p>
<input type="button" value="Sélection aléatoire" onclick="rnd();">
<img id="ajax-loader" src="https://www.world-lolo.com/images/uploads/image.num1349015472.of.world-lolo.com.gif" alt="Sélection en cours">
</p>
</form>

<script type="text/javascript">
var rnd = function () {
var loader, things;
loader = document.getElementById('ajax-loader');
loader.style.display = 'inline';
things = document.getElementById('things').value;
things = things.replace(', ', ',');
things = things.split(',');
setTimeout(function () {
var thing;
loader.style.display = 'none';
thing = Math.floor(Math.random() * things.length);
document.getElementById('result').innerHTML = things[thing];
}, 500);
};
</script>

<h2>Resultat :</h2>
<div id="result">Cliquez sur <b>Sélection aléatoire</b> pour afficher un résultat aléatoire.</div>
</body>
</html>

• Annonce ToutSurTout

Message 1 Discussion postée le 30-09-2012 à 16:45:18

Sélecteur aléatoire