флажок JavaScript основной - PullRequest
Новая
       3

флажок JavaScript основной

1 голос
/ 08 февраля 2011

Я просто пытаюсь получить предупреждение, которое является результатом проверки флажка.Я не могу изолировать чек-событие.он срабатывает, когда я загружаю страницу, хотя я пытаюсь изначально установить для свойства check значение false.

Поиск этого привел меня к jquery и тому подобному, но для формального обучения javascript мне нужно придерживаться javascript и сначала разбираться с этим (jquery будет моим следующим курсом).

вот код: 

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">
  <head>
    <title>JavaScript Challenges</title>
    <script type="text/javascript">
    window.onload = function(){
   checkbox = document.getElementById("subscribe");
 checkbox.checked = false;


 if (checkbox.checked = true){
    alert("checked works");
    }

}

    </script>
  </head>
  <body>
    <form action="">
      <fieldset>

        <legend>Email subscriptions</legend>

        <p id="subscribepara">
          <label>
            <input type="checkbox" name="subscribe" id="subscribe">
            Yes! I would like to receive the occasional newsletter via email.
          </label>
        </p>

        <p id="emailpara">
          <label>
            Email Address:
            <input type="text" name="email" id="email">
          </label>
        </p>

      </fieldset>
    </form>
  </body>
</html>

это вызов javascript от wikiversity btw.вторая часть первого вызова.Первая часть, где вам нужно Скрытие элемента электронной почты с помощью style.display = 'none' работает нормально.

Ответы [ 6 ]

2 голосов
/ 08 февраля 2011

Если вы хотите, чтобы событие активировалось после установки флажка, вам не следует привязывать его к window.onload, а к событию onchange флажка: 

<script>
    var checkbox = document.getElementById('subscribe');
    checkbox.onchange = function() {
        if (checkbox.checked = true){
            alert("checked works");
        }
    }
</script>

Обратите внимание , что событие onchange не работает для Internet Explorer так же, как другие браузеры. Это совсем другая тема, поэтому, если вам нужна дополнительная информация по этому вопросу, посмотрите на этот вопрос .

Также обратите внимание , что указанная выше функция должна быть определена ниже фактического элемента ввода. Если вы включите этот пример в <head>, он еще не знает о существовании элемента с идентификатором subscribe, и JavaScript не будет работать. Лучшей, более гибкой альтернативой является привязка обработчиков событий после загрузки DOM , но для краткости я советую вам поискать SO или Google по этому вопросу, если вам нужна дополнительная информация:)

2 голосов
/ 08 февраля 2011

Похоже, что это срабатывает, потому что оператор сравнения не работает: 

if (checkbox.checked = true)

должно быть 

if (checkbox.checked == true)

В вашей версии по существу устанавливается проверенное состояние в true.Эта операция выполнена успешно, и, следовательно, сама преобразуется в значение true (в результате ввод условия и просмотр предупреждения).

Кроме того, этот код не будет срабатывать при установке флажка вручную.Это выполняется только один раз, когда страница загружается.Один из способов привязки к событию click состоит в том, чтобы указать вызов функции в разметке для флажка.

Лучше проектировать не делать это в разметке, а отделять коди привязать к событиям извне.Но вы попадете в это, когда войдете в jQuery.Начиная с основ это нормально.

0 голосов
/ 08 февраля 2011

Вы можете использовать функцию и запускать ее через событие onclick. Таким образом, вы можете использовать его и для других флажков. 

# js
function alert_on_checked(elementId) {
  var checkbox = document.getElementById(elementId);
  if(checkbox.checked) {
    alert('checked works!');
  }
}

# html
...
<input type="checkbox" name="subscribe" id="subscribe" onclick="alert_on_checked(this.id)" >
...
0 голосов
/ 08 февраля 2011

Проверьте ваше сравнение , checkbox.checked = true является назначением.Исследуйте событие onClick

Поскольку это по сути домашнее задание, я не публикую рабочий код.Вы близки, и после прочтения вы получите это.

0 голосов
/ 08 февраля 2011

Чтобы функция вызывалась действием флажка, вам необходимо добавить прослушиватель событий в флажок.Вот как это сделать: 

// you have to do it inside the window.onload function so you know the DOM is available
window.onload = function(){
var checkbox = document.getElementById("subscribe");
checkbox.onchange = function(){
  if(checkbox.checked == true){
    alert('checked!');
  }
};
};

Свойство "onchange" устанавливается на функцию, которая будет вызываться каждый раз, когда флажок изменяет состояние с отмеченного на непроверенное и наоборот.Внутри этой функции мы проверяем значение флажка и при необходимости запускаем предупреждение.

Надеюсь, это поможет!

0 голосов
/ 08 февраля 2011

Я думаю, что ваш подход немного отличается - важно, что вы на самом деле совсем не ловите / не обрабатываете события прямо сейчас.В настоящее время, когда страница загружает , вы смотрите на проверенное состояние флажка, возможно, запуская предупреждение.Насколько я понимаю, требование заключается в том, что вы выводите предупреждение, когда флажок изменен на установленный.

(И, как отметил Дэвид, вы фактически проверяете флажок, когдавыполните проверку.)

Вместо этого вы должны зарегистрировать прослушиватель для события onchange флажка, который будет выполнять некоторый код каждый раз, когда флажок изменяется.Поскольку звучит так, будто вы хотите изучить это, я оставлю это здесь, вместо того, чтобы дать какой-то точный код.Взгляните на это введение в обработчики событий , если вы хотите глубже прочесть о том, что и как (обратите внимание, что это гораздо более сложное, что вам нужно для этого конкретного случая).

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

Нет похожих вопросов

...