Solució web-dinamica-jqueryII

De wikiserver
Dreceres ràpides: navegació, cerca
<!DOCTYPE html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
        <script src="https//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
        <script>
            $(document).ready(function () {

                $('#angelet,#diablet,.angelet,.diablet').click(function () {

                    var valor = Math.floor((Math.random() * 10) + 1);  //genera el número de veces que desea crear o eleminar un botón.
                    for (var i = 0; i < valor; i++) {
                        if (Math.round(Math.random())) { //genera aleatoriamente un 0 ó 1 


                            $('div#botones').append('<input class="angelet" type="submit" value="angelet">');
                            $('div#botones').on('click', 'input.angelet', function () {   //div es el padre y input.angelet los hijos que asocia un evento
                                if (Math.round(Math.random())) {      //genera aleatoriamente un 0 ó 1 para crear o un angelet o un diablet
                                    $('div').append('<input class="angelet" type="submit" value="angelet">')
                                } else {
                                    $('div').append('<input class="diablet" type="submit" value="diablet">');
                                }
                            });
                        }

                        else {
                            $('div#botones').append('<input class="diablet" type="submit" value="diablet">');
                            $('div#botones').on('click', 'input.diablet', function () {
                                $('input:last').remove();

                            });
                        }
                    }


                });


            });

        </script>
        <style>


        </style>
    </head>
    <body>

        <input id="angelet" type="submit" value="angelet">
        <input id="diablet" type="submit" value="diablet">
        <div id="botones"></div>

    </body>
</html>