liliana78 | Bonjour à tous !
Pour vous mettre au parfum, je suis à la limite du nul en informatique. L'élaboration du script que je vais vous présenter m'a pris beaucoup de temps...
Voilà, je suis correctrice de textes en français (je corrige les romans, les thèses... au niveau de l'orthographe, de la grammaire...).
J'ai un script qui permet à l'internaute de calculer le coût de la correction en fonction de divers critères (nombre de mots, formule, statut...).
J'avais d'ailleurs déjà posté sur ce forum et obtenu de l'aide.
Voici le script :
Code :
- <!DOCTYPE html>
- <html lang="fr">
- <head>
- <meta charset="utf-8">
- <title>Devis pour correction – Liliana78</title>
- <style>
- body {
- background-size: 5px 900px, 6px 6px;
- font-family: Verdana, Geneva, sans-serif;
- font-size: 14px;
- color: #000309;
- text-align: center;
- line-height: 24px;
- }
- #page {
- width: 1300px;
- margin: auto;
- padding: 20px;
- background: #d8d8d8; /* Old browsers */
- background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #d8d8d8), color-stop(100%, #ffffff)); /* Chrome,Safari4+ */
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#d8d8d8', endColorstr='#ffffff', GradientType=0); /* IE6-9 */
- background: -moz-linear-gradient(top, #d8d8d8 1%, #ffffff 100%); /* FF3.6+ */
- background: -webkit-linear-gradient(top, #d8d8d8 1%, #ffffff 100%); /* Chrome10+,Safari5.1+ */
- background: -o-linear-gradient(top, #d8d8d8 1%, #ffffff 100%); /* Opera 11.10+ */
- background: -ms-linear-gradient(top, #d8d8d8 1%, #ffffff 100%); /* IE10+ */
- background: linear-gradient(to bottom, #d8d8d8 1%, #ffffff 100%); /* W3C */
- }
- .prix {
- font-weight: bold;
- font-size: 200%;
- color: blue;
- }
- h1 {
- font-size: 0em;
- line-height: 1em;
- margin: 0;
- text-transform: uppercase;
- }
- fieldset {
- border: none;
- margin: 0 0 1ex;
- padding: 0;
- }
- .explications {
- border-left: solid thin #0042b0;
- padding-left: 1ex;
- }
- .explications ul {
- list-style: none;
- font-size: 14px;
- font-style: italic;
- padding: 0;
- }
- .explications li {
- margin: 1ex 0;
- }
- .explications h2 {
- font-style: italic;
- font-size: 2em;
- font-weight: bold;
- margin: 0 0 1em;
-
- }
- explications h3 {
- font-style: italic;
- font-size: 2em;
- margin: 0 0 1em;
- }
- .etape {
- font-weight: bold;
- text-transform: uppercase;
- }
- .etape::after {
- content: "\00A0: ";
- }
- </style>
- </head>
- <body>
- <section id="page">
- <h1>Calculez le coût de votre correction</h1>
- <form id="testform">
- <fieldset>
- <p>
- <label for="nbchar" class="etape">Nombre de mots</label>
- <input id="nbchar" type="text" name="nbchar" value="0"/>
- </p>
- <div class="explications">
- <h2>Où trouver le nombre de mots ? </h2>
- <ul>
- <li>Word 2007, 2010 et 2013 : En bas à gauche de la fenêtre du logiciel.
- </li>
- <li>Word 2003/OpenOffice : Cliquez sur <strong>Outils</strong>,
- puis <strong>Statistiques.</strong> Repérez la ligne
- <strong>"mots".</strong>
- </li>
- </ul>
- </div>
- </fieldset>
- <fieldset>
- <p>
- <strong class="etape">Formule</strong>
- <input id="forumle1" type="radio" name="formule" value="1" checked="checked"/>
- <label for="forumle1">Simple</label>
- <input id="formule2" type="radio" name="formule" value="2"/>
- <label for="formule2">Approfondie</label>
- </p>
- <p class="details">
- Voir <a href="formules/correction-reformulation">Tableau comparatif des formules de correction</a>
- </p>
- <p>
- <label class="etape" for="formjur">Statut</label>
- <select id="formjur" name="formjur">
- <option value="0">Étudiant</option>
- <option value="1">Particulier</option>
- <option value="2">Professionnel</option>
- </select>
- <input type="submit" value="Calculer"/>
- </p>
- </fieldset>
- </form>
- <div id="resultat"></div>
- <div id="resultatSupplement"></div>
- </section>
- <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
- <script type="text/javascript">// <![CDATA[
- function formatNumber(num) {
- return num.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1 " )
- }
- function supplement(result) {
- var more = (result * 10) / 100;
- return Math.ceil(result + more);
- }
- $(function () {
- $("input:submit" ).click(
- function () {
- var calcul = 0;
- var coefReduction = 10 / 100;
- var supp;
- if ($("input:checked" ).val() == 1) {
- supp = false;
- if ($("#formjur" ).val() == 1) {
- calcul = $("#nbchar" ).val() * 0.020;
- } else if ($("#formjur" ).val() == 2) {
- calcul = $("#nbchar" ).val() * 0.0237;
- } else {
- calcul = $("#nbchar" ).val() * 0.0178;
- }
- } else {
- supp = true;
- if ($("#formjur" ).val() == 1) {
- calcul = $("#nbchar" ).val() * 0.0346;
- } else if ($("#formjur" ).val() == 2) {
- calcul = $("#nbchar" ).val() * 0.0395;
- } else {
- calcul = $("#nbchar" ).val() * 0.0297;
- }
- }
- var resultat = Math.ceil(calcul);
- var resultatMajore = resultat + (calcul * coefReduction);
- var resultatSupplement = supplement(resultat);
- var resultatSupplementMajore = Math.round(resultatSupplement + (resultatSupplement * coefReduction));
- $("#resultat" ).html("Tarif généralement appliqué : <span class=\"prix\">" + formatNumber(resultat) + " € </span>/ Si correction en rouge : <span class=\"prix\">" + formatNumber(Math.round(resultatMajore)) + " € </span>" );
- return false;
- }
- );
- });
- // ]]></script>
|
Voici mes deux demandes d'aide :
- L'internaute doit renseigner le nombre de mots de son document. S'il inscrit, par exemple, 158747 (sans espaces), cela marche. Mais s'il met un espace (158 747), non. Comment faire pour que le tarif s'affiche même en insérant un espace ?
- Le cadre du formulaire dépasse le template. Je modifie "width", mais ça élargit juste la page du template.
Je vous remercie de votre aide, car je galère pas mal...
Liliana
|