Мой javascript код не работает из-за моей инфы l oop, сделанной по назначению - PullRequest
0 голосов
/ 26 января 2020

Хе, я начал с javascript и сделал цель l oop по назначению. Проблема в том, что он не выполняется. Не думай, что я не хочу бесконечного, я делаю, но это не работает! Вопрос: есть ли способ заставить бесконечную работу l oop в javascript?
Вот мой код:

    $("button").click(function(){
        var panier=[]
        var prix=[]
        var a=$("input").val()
        if (a==="0005"){
            $(".ght").remove()
            while(1===1){
                $('<p class="sur" style="color:blue;font-size:30px;font-weight:bold"> Bonjour, Utilisateur Samir</p><br><p class="sur">Que vouller vous faire?</p><br><ul class="sur" ><li><button style="color:green" id="b1">Ajouter au panier</button></li><br><li><button style="color:red" id="b2">Suprimmer un article</button></li><br><li><button style="color:blue" id="b3">Voir le panier</button></li><br><li><button style="color:purple"id="b4">Payer</button></li></ul>').prependTo($('body'))
                $("#b1").click(function(){
                    $(".sur").remove()
                    $('<div class="Col"><h1>Ajouter un article</h1><br><ol><li><button id="b11">Crayon Crayola</button><img src="hahaah.jpg"style="width:100px"></li><li><button id="b12">Cahier Canada</button><img src="it.jpg" style="width:100px"></li><li><button id="b13">Fauteuil en Cuir</button><img src="th.jpeg"style="width:100px"></li><li><button id="b14">Bureau d`etudiant</button><img src="th-1.jpeg"style="width:100px"></li><li><button id="b15">Fauteuil en Cuir</button><img src="th.jpeg"style="width:100px"></li><li><button id="b16">laptop HP</button><img src="down.jpg"style="width:100px"></li></li><li><button id="b17">Laptop acer</button><img src="download.jpg"style="width:100px"></li><li><button id="b18">Laptop ASUS</button><img src="download-2.jpg"style="width:100px"></li></ol><div>').prependTo('body');
                    $("#b11").click(function(){
                        panier.push("Crayon Crayola");
                        console.log(panier);
                        prix.push(3.39)
                        console.log(prix);
                        $(".Col").remove()
                    })
                })
            }
        }
    })
})

И My HTML:

<html lang="en">
    <head>
        <link rel="stylesheet" type="text/css" href="style.css">
        <title>Le Mini-Magasin de Adem</title>
        <script type="text/javascript" src="jquery-2.0.0.min.js"></script>
        <script type="text/javascript" src="main.js"></script>
    </head>
    <body>
        <h1 style="color: green;text-align: center;font-size: 75px;font-family: Arial, Helvetica, sans-serif;" class="ght">Bienvenue</h1>
        <img src="data:image/jpeg;base64,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" alt="Shopping Bag" class="ght">
        <br class="ght"><br class="ght"><br class="ght">
        <form class="ght">
            <label for="numero-d'employes" class="ght">Numero de compte</label>
            <input type="text" id="numero-d'employes" class="ght">
            <button class="ght" type="button">Valider</button>
        </form>
    </body>
</html>

Finnaly CSS:

    font-family: Arial, Helvetica, sans-serif;
}
ul button {
    background-color: Transparent;
    background-repeat:no-repeat;
    border: none;
    cursor:pointer;
    overflow: hidden;
    outline:none;
    font-size: large;
}
ol button{
    background-color: transparent;
    background-repeat: no-repeat;
    border: none;
    cursor: pointer;
    overflow: hidden;
    outline: none;
    font-size: large;
}

Мой редактор кода - Visual Studio Code! Любая помощь приветствуется!

1 Ответ

0 голосов
/ 27 января 2020

Чтобы ответить на ваш вопрос, l oop просто отлично. Однако, не зная ваших намерений, код выглядит немного странно.

Возможны как минимум следующие проблемы для проверки и исправления:

  1. Событие $("button").click() не запускается .
  2. Значение $("input").val() может быть чем-то иным, чем 0005, поэтому у вашего l oop никогда не будет шанса на запуск.
  3. Операции DOM изнутри l oop не будет отображаться, пока l oop не остановится. js занят выполнением вашего l oop и не получает возможности перерисовывать обновления DOM. Чтобы смягчить это, избегайте while l oop и используйте SetInterval(). Например,

    function StuffToBeDoneInTheLoop()
    {
     // Put the DOM operations in here
    }
    setInterval(StuffToBeDoneInTheLoop, 1)
    

setInterval() дает JS возможность повторно визуализировать DOM и обрабатывать другие события.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...