JQuery множественный выбор - PullRequest
Новая
       18

JQuery множественный выбор

0 голосов
/ 14 марта 2012

Я пытаюсь создать один вопрос с несколькими вариантами ответов.

В приведенном ниже примере я бы хотел, чтобы варианты 1 и 3 были правильным ответом.Когда нажата кнопка отправки, я просто хотел запустить if statment, чтобы увидеть, установлены ли флажки 1 и 3, и если это так, переключить correct1 div.Иначе, если опции 1 и 3 не выбраны , переключите неправильный1 дел.

в теге Head, у меня будет 

<script type="text/javascript">
    function toggleDiv2(divId) {
    $("#"+divId).toggle("slow");
            }
</script>

Тогда в теле я бы имел: 

<div class="control-group">

            <label class="control-label" for="optionsCheckboxList">Check your answers</label>
            <div class="controls">
              <label class="checkbox">
                <input type="checkbox" id="option1" name="optionsCheckboxList1" value="option1">
                <strong>Option One</strong> this is a correct answer. Select this one.
              </label>
              <label class="checkbox">
                <input type="checkbox" id="option2" name="optionsCheckboxList2" value="option2">
                <strong>Option two</strong>  this is an incorrect answer. Do not select this one.
              </label>
              <label class="checkbox">
                <input type="checkbox" id="option3" name="optionsCheckboxList3" value="option3">
                <strong>Option three</strong>  This is a correct answer. Select this one.
              </label>
              <p class="help-block"><strong>Hint:</strong> Add a hint if you would like. This is optional.</p>
          <br>


        <a href="javascript:toggleDiv2('correct1');" class="btn btn-primary">Submit</a>

          <br><br>

            <div id="correct1" class="alert alert-success" style="display: none">
            Well Done! You correctly answered this question!
            </div><!-- end correct1 -->

            <div id="incorrect1" class="alert alert-error" style="display: none">
            Oh snap! Please try again.
            </div><!-- end incorrect1 -->
            </div><!-- end control-group -->

Не уверен, имеет ли это значение или нет, но это jquery, на который ссылается страница: 

<script src="html/assets/js/jquery-ui-1_8_18custom/js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="html/assets/js/jquery-ui-1_8_18custom/js/jquery-ui-1.8.18.custom.min.js" type="text/javascript" ></script>

1 Ответ

0 голосов
/ 15 марта 2012

Это работает ... 

<script type="text/javascript">
   function toggleDiv2() {
   if($("#option1").is(':checked') && $("#option3").is(':checked'))
   $("#correct1").toggle("slow");
    else
   $("#incorrect1").toggle("slow");
   }
</script>
...