Показать сообщение отдельно
  #12 (permalink)  
Старый 27.06.2015, 15:48
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,127

тест правильности выбора селекторов
LoolGram,
но как вы обьясните этот код преподавателю ?
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <script>

  </script>
</head>
<body>
  <img src="https://cdn0.iconfinder.com/data/icons/small-n-flat/24/678069-sign-error-32.png">
   <img src="https://cdn0.iconfinder.com/data/icons/small-n-flat/24/678134-sign-check-32.png">
 <form name="quiz" >
                    <table id="table" style="font-size: 24px;">
                        <tr>
                            <td>а | аа </td>
                            <td>
                                <select name="q1" class="ComboBox">
                                        <option value="">Выберите</option>
                                        <option value="1">ой</option>
                                        <option value="2">ай</option>
                                        <option value="3">эй</option>
                                        <option value="4">уй</option>
                                        <option value="5">ы</option>
                                        <option value="6">үй</option>
                                </select>
                            </td>
                            <td>
                                <img height= 32px width=32px>
                            </td>
                        </tr>
                        <tr>
                            <td>э | ээ</td>
                            <td>
                                <select name="q2" class="ComboBox">
                                    <option value="">Выберите</option>
                                    <option value="1">ой</option>
                                    <option value="2">ай</option>
                                    <option value="3">эй</option>
                                    <option value="4">уй</option>
                                    <option value="5">ы</option>
                                    <option value="6">үй</option>
                                </select>
                            </td>
                            <td>
                                <img height= 32px width=32px>
                            </td>
                        </tr>
                        <tr>
                            <td> о | оо</td>
                            <td>
                                <select name="q3" class="ComboBox">
                                    <option value="">Выберите</option>
                                    <option value="1">ой</option>
                                    <option value="2">ай</option>
                                    <option value="3">эй</option>
                                    <option value="4">уй</option>
                                    <option value="5">ы</option>
                                    <option value="6">үй</option>
                                </select>
                            </td>
                            <td>
                                <img height= 32px width=32px>
                            </td>
                        </tr>
                               </table>

                    <input type="submit" value="Проверить" >

</form>
<script>
function fn(event) {
    event.preventDefault();
    var trs = this.querySelectorAll("tr");
    [].forEach.call(trs, function(el) {
        var text = el.cells[0].textContent.replace(/\s+/g, ""),
            box = el.querySelector(".ComboBox"),
            i = box.selectedIndex || 0,
            img = el.querySelector("img");
        i = box.options[i].text;
        text = new RegExp("(" + text + ")", "i");
        text = text.test(i);
        img.src = "https://cdn0.iconfinder.com/data/icons/small-n-flat/24/" + (text ? "678134-sign-check-32.png" : "678069-sign-error-32.png")
    })
};

document.forms.quiz.addEventListener( "submit" , fn, false);
</script>
</body>
</html>

Последний раз редактировалось рони, 27.06.2015 в 15:51.
Ответить с цитированием