Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.11.2017, 22:53
Аспирант
Отправить личное сообщение для АнонимныйПарень Посмотреть профиль Найти все сообщения от АнонимныйПарень
 
Регистрация: 17.03.2017
Сообщений: 67

Вывод елементов
Ребята, есть вопрос, где ошибка?

Нет возможности выложить куда либо, так что если можете потестите у себя. Очень нужно решить проблему, суть: вывод вопросов и вариантов ответа рандомно, но без повторений вопросов и вариантов ответа!



<center>
    <div class="quetions">
        <div class="one quetions_mark">
            Питання №1: Що з поданого переліку НЕ можна робити в кабінеті інформатики?
        </div>
            
        <div class="two quetions_mark">
            Питання №2: З інформацією МОЖНА робити:
        </div>
            
        <div class="three quetions_mark">
            Питання №3: Яке з стверджень правильне?
        </div>

        <div class="four quetions_mark">
            Питання №4: Яке з стверджень НЕ правильне?
        </div>

        <div class="five quetions_mark">
            Питання №5: Що треба зробити перед тим, як вимикати комп’ютер?
        </div>

        <div class="six quetions_mark">
            Питання №6: Чого НЕ має на робочому столі в комп’ютера?
        </div>

        <div class="seven quetions_mark">
            Питання №7: Яку дії миша НЕ може зробити?
        </div>

        <div class="eight quetions_mark">
            Питання №8: До якої групи відносять клавіші "Windows","Tab","Esc",?
        </div>

        <div class="nine quetions_mark">
            Питання №9: Які пристрої призначені для роботи з повідомленнями?
        </div>

        <div class="ten quetions_mark">
            Питання №10: Що з переліку нижче НЕ є властивістю об'єкта "Яблуко"?
        </div>
    </div>  

    <div class="answers">
        <div class="one answer-holder">
            <div class="btn btn-success answer" value="0"> Малювати на папері</div>
            <div class="btn btn-success answer" value="0"> Розмовляти з однокласниками </div>
            <div class="btn btn-success answer" value="0"> Відповідати на запитання вчителя </div>
            <div class="btn btn-success answer" value="1"> Вмикай комп’ютер без дозволу вчителя </div>
        </div>
        <div class="two answer-holder">
            <div class="btn btn-success answer" value="1"> Створювати </div>
            <div class="btn btn-success answer" value="0"> Їсти </div>
            <div class="btn btn-success answer" value="0"> Розмальовувати </div>
            <div class="btn btn-success answer" value="1"> Опрацьовувати </div>
        </div>
        <div class="three answer-holder">
            <div class="btn btn-success answer" value="0"> Принтер - це пристрій, призначений для створення зображень певних об'єктів шляхом обробки променів </div>
            <div class="btn btn-success answer" value="0"> Монітор або дисплей — це електронний пристрій для копіювання інформації.  </div>
            <div class="btn btn-success answer" value="1"> Модем - це пристрій, який надає змогу підключитися до Internet </div>
            <div class="btn btn-success answer" value="0"> Сканер - це друкувальний пристрій </div>
        </div>
        <div class="four answer-holder">
            <div class="btn btn-success answer" value="0"> Меню програми — це список об’єктів, які можна вибирати. </div>
            <div class="btn btn-success answer" value="0"> Нижче Рядка заголовка програми розташований Рядок меню </div>
            <div class="btn btn-success answer" value="0"> Програми керують діями комп’ютера </div>
            <div class="btn btn-success answer" value="1"> Комп’ютер не завжди працює під керуванням програм </div>
        </div>  
        <div class="five answer-holder">
            <div class="btn btn-success answer" value="0"> Натиснути ПУСК </div>
            <div class="btn btn-success answer" value="0"> Натисни кнопку Power на системному блоці </div>
            <div class="btn btn-success answer" value="0"> Вимкнути монітор </div>
            <div class="btn btn-success answer" value="1"> Закрий вікна всіх програм </div>
        </div>  
        <div class="six answer-holder">
            <div class="btn btn-success answer" value="0"> Панелі завдань </div>
            <div class="btn btn-success answer" value="0"> Ярликів </div>
            <div class="btn btn-success answer" value="1"> Інтернету </div>
            <div class="btn btn-success answer" value="0"> Папок та файлів </div>
        </div>      
        <div class="seven answer-holder">
            <div class="btn btn-success answer" value="0"> Відкрити контекстне меню </div>
            <div class="btn btn-success answer" value="0"> Запустити програму </div>
            <div class="btn btn-success answer" value="1"> За допомогою комбінації клавіш миші вимнути комп’ютер </div>
            <div class="btn btn-success answer" value="0"> Прокрутити вниз веб сторінку </div>
        </div>  
        <div class="eight answer-holder">
            <div class="btn btn-success answer" value="1"> Спеціальні клавіші </div>
            <div class="btn btn-success answer" value="0"> Клавіші керування курсором </div>
            <div class="btn btn-success answer" value="0"> Алфавітно-цифрові клавіші </div>
            <div class="btn btn-success answer" value="0"> Функціональні клавіші </div>
        </div>  
        <div class="nine answer-holder">
            <div class="btn btn-success answer" value="0"> Телефон, Калькулятор, Флешка </div>
            <div class="btn btn-success answer" value="0"> Диктофон, Фотокамера, Навушники </div>
            <div class="btn btn-success answer" value="0"> Факс, Плеєр, Духова шафа </div>
            <div class="btn btn-success answer" value="1"> Телефон, Модем, Факс </div>
        </div>  
        <div class="ten answer-holder">
            <div class="btn btn-success answer" value="0"> Колір </div>
            <div class="btn btn-success answer" value="1"> Особисті вподобання </div>
            <div class="btn btn-success answer" value="0"> Вага </div>
            <div class="btn btn-success answer" value="0"> Розмір </div>
        </div>          
    </div>
</center>


Есть js
var correctly, wrong;
var item;

var random =  {
    massive : [
        'two',
        'three',
        'four',
        'five',
        'six',
        'seven',
        'eight',
        'nine',
        'ten'
    ],
    already : [],
    randomizer : function () {
        this.massive[Math.floor(Math.random() * this.massive.length)];
    },
    get : function () {
        item = this.randomizer();
        if (this.already.length >= this.massive.length) {
            this.already = [];
            return item;
        }
        if (this.already.indexOf(item) != -1) {
            this.get();
        }
        else {
            this.already.push(item);
            return item;
        }
    }
};

window.onload = function () {
    $(".quetions>div, .answers>div").css({display : "none"});
    $(".one").css({ display : "block" });
    
    $(".answers>div>div").on("click", function() {
        $(".quetions>div, .answers>div").css({display : "none"});

        if ($(this).attr("value").valueOf() == "1") {
            correctly++;
        }
        else {
            wrong++;
        }

        $("."+random.get()+"").css({ display : "block" });
    });

};
Ответить с цитированием
  #2 (permalink)  
Старый 30.11.2017, 23:24
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,587

randomizer : function () {
    *!*return*/!* this.massive[Math.floor(Math.random() * this.massive.length)];
},

Но вообще код хреновый. Вместо того чтоб неизвестное количество раз пытаться найти новый рандомный элемент массива, можно было бы как минимум просто перекладывать из одного в другой.
Глобальный item - тоже кривота несусветная.
__________________
29375, 35

Последний раз редактировалось Aetae, 30.11.2017 в 23:30.
Ответить с цитированием
  #3 (permalink)  
Старый 01.12.2017, 02:15
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,114

вопросник, тестирование, случайный вывод блоков
АнонимныйПарень,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
   .quetions{
     margin: 0 auto;
     text-align: center;
     position: relative;
     height: auto;
     background-color: #DEB887;
   }
   .quetions .quetions_mark , .answers .answer-holder{
      display: none;
   }
   .quetions  .quetions_mark.active, .answers .answer-holder.active{
    margin-top: 0%;
     display: block;
  }

  .answers{
     position: relative;
     margin-left: 20%;
     text-align: left;
     height: auto;
   }

  .answers .answer:hover  {
    cursor: pointer;
    background-color: #D3D3D3;
  }

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>
$(function() {
    var correctly = 0,
        wrong = 0,
        quetions = $(".quetions .quetions_mark").get();

    function rand() {
        $(".quetions .quetions_mark.active").removeClass("active");
        $(".answers .answer-holder.active").removeClass("active");
        if (!quetions.length) return;
        var n = Math.random() * quetions.length | 0;
        var el = quetions.splice(n, 1)[0];
        var indx = $(".quetions .quetions_mark").index(el);
        $(".quetions .quetions_mark").eq(indx).addClass("active");
        var holder = $(".answers .answer-holder").eq(indx).addClass("active");
        var answer = holder.find(".answer").get().sort(function() {
            return Math.random() > .5
        });
        holder.append(answer);
        return true
    }
    rand();
    $(".answers").on("click", ".answer", function() {
        var num = $(this).data("value");
        num ? correctly++ : wrong++;
        var text = "correctly : " + correctly + " wrong : " + wrong;
        !rand() && (text += " thanks all");
        $(".total").text(text)
    })
});
  </script>
</head>

<body>
    <div class="total">correctly : 0 wrong : 0</div>
    <div class="quetions">
        <div class="one quetions_mark">
            Питання №1: Що з поданого переліку НЕ можна робити в кабінеті інформатики?
        </div>

        <div class="two quetions_mark">
            Питання №2: З інформацією МОЖНА робити:
        </div>

        <div class="three quetions_mark">
            Питання №3: Яке з стверджень правильне?
        </div>

        <div class="four quetions_mark">
            Питання №4: Яке з стверджень НЕ правильне?
        </div>

        <div class="five quetions_mark">
            Питання №5: Що треба зробити перед тим, як вимикати комп’ютер?
        </div>

        <div class="six quetions_mark">
            Питання №6: Чого НЕ має на робочому столі в комп’ютера?
        </div>

        <div class="seven quetions_mark">
            Питання №7: Яку дії миша НЕ може зробити?
        </div>

        <div class="eight quetions_mark">
            Питання №8: До якої групи відносять клавіші "Windows","Tab","Esc",?
        </div>

        <div class="nine quetions_mark">
            Питання №9: Які пристрої призначені для роботи з повідомленнями?
        </div>

        <div class="ten quetions_mark">
            Питання №10: Що з переліку нижче НЕ є властивістю об'єкта "Яблуко"?
        </div>
    </div>

    <div class="answers">
        <div class="one answer-holder">
            <div class="btn btn-success answer" data-value="0"> Малювати на папері</div>
            <div class="btn btn-success answer" data-value="0"> Розмовляти з однокласниками </div>
            <div class="btn btn-success answer" data-value="0"> Відповідати на запитання вчителя </div>
            <div class="btn btn-success answer" data-value="1"> Вмикай комп’ютер без дозволу вчителя </div>
        </div>
        <div class="two answer-holder">
            <div class="btn btn-success answer" data-value="1"> Створювати </div>
            <div class="btn btn-success answer" data-value="0"> Їсти </div>
            <div class="btn btn-success answer" data-value="0"> Розмальовувати </div>
            <div class="btn btn-success answer" data-value="1"> Опрацьовувати </div>
        </div>
        <div class="three answer-holder">
            <div class="btn btn-success answer" data-value="0"> Принтер - це пристрій, призначений для створення зображень певних об'єктів шляхом обробки променів </div>
            <div class="btn btn-success answer" data-value="0"> Монітор або дисплей — це електронний пристрій для копіювання інформації.  </div>
            <div class="btn btn-success answer" data-value="1"> Модем - це пристрій, який надає змогу підключитися до Internet </div>
            <div class="btn btn-success answer" data-value="0"> Сканер - це друкувальний пристрій </div>
        </div>
        <div class="four answer-holder">
            <div class="btn btn-success answer" data-value="0"> Меню програми — це список об’єктів, які можна вибирати. </div>
            <div class="btn btn-success answer" data-value="0"> Нижче Рядка заголовка програми розташований Рядок меню </div>
            <div class="btn btn-success answer" data-value="0"> Програми керують діями комп’ютера </div>
            <div class="btn btn-success answer" data-value="1"> Комп’ютер не завжди працює під керуванням програм </div>
        </div>
        <div class="five answer-holder">
            <div class="btn btn-success answer" data-value="0"> Натиснути ПУСК </div>
            <div class="btn btn-success answer" data-value="0"> Натисни кнопку Power на системному блоці </div>
            <div class="btn btn-success answer" data-value="0"> Вимкнути монітор </div>
            <div class="btn btn-success answer" data-value="1"> Закрий вікна всіх програм </div>
        </div>
        <div class="six answer-holder">
            <div class="btn btn-success answer" data-value="0"> Панелі завдань </div>
            <div class="btn btn-success answer" data-value="0"> Ярликів </div>
            <div class="btn btn-success answer" data-value="1"> Інтернету </div>
            <div class="btn btn-success answer" data-value="0"> Папок та файлів </div>
        </div>
        <div class="seven answer-holder">
            <div class="btn btn-success answer" data-value="0"> Відкрити контекстне меню </div>
            <div class="btn btn-success answer" data-value="0"> Запустити програму </div>
            <div class="btn btn-success answer" data-value="1"> За допомогою комбінації клавіш миші вимнути комп’ютер </div>
            <div class="btn btn-success answer" data-value="0"> Прокрутити вниз веб сторінку </div>
        </div>
        <div class="eight answer-holder">
            <div class="btn btn-success answer" data-value="1"> Спеціальні клавіші </div>
            <div class="btn btn-success answer" data-value="0"> Клавіші керування курсором </div>
            <div class="btn btn-success answer" data-value="0"> Алфавітно-цифрові клавіші </div>
            <div class="btn btn-success answer" data-value="0"> Функціональні клавіші </div>
        </div>
        <div class="nine answer-holder">
            <div class="btn btn-success answer" data-value="0"> Телефон, Калькулятор, Флешка </div>
            <div class="btn btn-success answer" data-value="0"> Диктофон, Фотокамера, Навушники </div>
            <div class="btn btn-success answer" data-value="0"> Факс, Плеєр, Духова шафа </div>
            <div class="btn btn-success answer" data-value="1"> Телефон, Модем, Факс </div>
        </div>
        <div class="ten answer-holder">
            <div class="btn btn-success answer" data-value="0"> Колір </div>
            <div class="btn btn-success answer" data-value="1"> Особисті вподобання </div>
            <div class="btn btn-success answer" data-value="0"> Вага </div>
            <div class="btn btn-success answer" data-value="0"> Розмір </div>
        </div>
    </div>


</body>
</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вывод выбранных данных и проверка checkbox MasterHrust Javascript под браузер 3 28.09.2011 17:44
Вывод переменных MasterHrust Javascript под браузер 4 03.08.2011 15:41
Вывод данных в Друпал 6 из MySQL, небольшая работа torquemada Работа 1 22.05.2011 17:05
вывод картинки и vrml mister_maxim Events/DOM/Window 16 12.01.2010 17:40
Пошаговый вывод скрипта для IE всех версий. Zidky Элементы интерфейса 10 17.06.2009 18:27