Переключатель Значения не проанализированы - PullRequest
Новая
       14

Переключатель Значения не проанализированы

0 голосов
/ 03 января 2012

Я строю систему расчета баллов, которая рассчитывает баллы на основе входного значения.Я использовал некоторые стили jquery ui на этой переключателе, и теперь он не суммируется.Код слишком длинный для размещения здесь, поэтому проверьте предварительный просмотр .я много раз читал код, ко, я ничего не нашел.

РЕДАКТИРОВАТЬ: вот урезанная версия моего кода: проблема с переключателями в div part2, пожалуйста, прочитайте мои комментарии. 

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Quebec and Federal Immigration Points Calculator</title>
    <link rel="stylesheet" href="files/jquery00.css">
    <link rel="stylesheet" href="files/flexselect.css">
    <link rel="stylesheet" href="files/demos000.css">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" type="text/javascript"></script>
    <script src="files/liquidmetal.js"></script>
    <script src="files/jquery.flexselect.js" type="text/javascript"></script>
    <script type="text/javascript">
          $(document).ready(function() {
            $("select.flexselect").flexselect();
            $( ".radio" ).buttonset();//here they are made into jquery ui buttonsets
            $('#part1').show('slow', function() {
            });
            });
    </script>
    <script type="text/javascript"> 
    function showAge(){ 
    var d =document.getElementById('dob').value.split('/'); 
    var today = new Date(); 
    var bday = new Date(d[2],d[1],d[0]);
    var age = today.getFullYear() - bday.getFullYear();  
    if(today.getMonth() < bday.getMonth() || (today.getMonth() == bday.getMonth() && today.getDate() < bday.getDate()))  
    {
         t = age-1;  
    }
    else {
    t = age
    }
    document.getElementById('form').age.value = t;
    } 
    </script>
    <script type="text/javascript">
    function compute(form)
    {
    var a = parseInt(document.getElementById('form').age.value, 10) || 0; 
    if ((18 <= a) && (a <= 35)){
        q = 16;
    }
    else if (a == 36){
        q = 14;
    }
    else if (a == 37){
        q = 12;
    }
    else if (a == 38){
        q = 10;
    }
    else if (a == 39){
        q = 8;
    }
    else if (a == 40){
        q = 6;
    }
    else if (a == 41){
        q = 4;
    }
    else if (a == 42){
        q = 2;
    }
    else if ((18 > a) || (a > 43)){
        q = 0;
    }
    var b = parseInt(document.getElementById('form').highed.value, 10) || 0;
    if (b == 1){
        c = 0;
    }
    else if (b == 2){
        c = 2;
    }
    else if (b == 3){
        c = 4;
    }
    else if (b == 4){
        c = 6;
    }
    var aos = parseInt(document.getElementById('form').selectareaofstudy.value, 10) || 0;
//here the value of the radiio button is parsed, and if nothing is selected it will default to zero
    var tcfc2 = parseInt(document.getElementById('form').TCFC2.value, 10) || 0;
    qt = (aos + c + q + tcfc2); 
    document.getElementById('total').age.value = q;
    document.getElementById('total').ed.value = c;
    document.getElementById('total').aos.value = aos;
    document.getElementById('total').tcfc2.value = tcfc2;//here the value is displayed
    document.getElementById('total').total.value = qt;//total displayed here   
    }
    </script>
    <script type="text/javascript">
    function show2() {
        $('#part1').hide('fast');
          $('#part2').show('slow');
    }
    function back2() {
        $('#part1').show('slow');
          $('#part2').hide('fast');
    }
    function showTCF() {
    if($('#radio1-1').is(':checked')) { alert("it's checked"); }
    }
    </script>
    </head>
    <body>
    <div id="formbox">
      <form id="form" name="form">
        <div id="part1" style="display:none">
          <div id="hidden">
            <p>Your Date of Birth (format:<strong>dd/mm/yyyy</strong>)</p>
            <br />
            <input onBlur="compute(this.form)" onchange="showAge()" name="dob" id="dob" />
          </div>
          <p>Your Age</p>
          <input class="sev" name="age" type="text" onMouseOver="compute(this.form)" style="font-size: 15px" value="" size="7" />
          <h1>Your education</h1>
          <h2>Your highest level of Education:</h2>
          <select onchange="compute(this.form)" name="highed">
            <option value="">Select One</option>
            <option value="1">No high school diploma or general Professional</option>
            <option value="2">High school general diploma +2 or 12th grade</option>
            <option value="3">Postsecondary diploma  2 years general  of full-time studies</option>
            <option value="4">Postsecondary technical diploma  1 year of full-time studies</option>
            <option value="4">Postsecondary technical diploma  2 years of full-time studies</option>
          </select>
          <h2>Your Area of Education:<small>(start typing..)</small></h2>
          <select class="flexselect" name="selectareaofstudy">
            <option value=""></option>
            <option value="6">3D Animation and Image Synthesis Techniques (DCS - 3 years) </option>
            <option value="6">LOADS OF OTHER VALUES HERE</option>
          </select>
          <br />
          <br />
          <INPUT class="ten" NAME="calc" VALUE="Calculate" TYPE="button" onClick="compute(this.form)">
          &nbsp;&nbsp;
          <INPUT class="ten" NAME="calc" VALUE="Next" TYPE="button" onClick="show2()">
          <br />
        </div>
        <div id="part2" style="display:none">
          <h2>French Proficiency</h2>
          <p>Have you written: <strong>TCF Quebec/ TEFaQ/ TCF/ TEF level C2- DALF C2?</strong> </p>
          <div id="radio1" class="radio">
<!--These radio buttons have values of 1 and 2 but when calculated they always show up as zero, the default values.-->
            <input id="radio1-1" name="TCFC2" type="radio" value="1" checked="checked" />
            <label for="radio1-1">Yes</label>
            <input id="radio1-2" name="TCFC2" type="radio" value="2"  />
            <label for="radio1-2">No</label>
          </div>
          <br />
          <br />
          <br />
          <INPUT class="ten" NAME="calc" VALUE="Calculate" TYPE="button" onClick="compute(this.form)">
          &nbsp;&nbsp;
          <table>
            <tr>
              <td><INPUT class="ten" NAME="calc" VALUE="Back" TYPE="button" onClick="back2()"></td>
              <td><INPUT class="ten" NAME="calc" VALUE="Next" TYPE="button" onClick="show3()"></td>
            </tr>
          </table>
        </div>
      </form>
    </div>
    <div style="" id="totalmenu" class="port-menu-wrapper">
      <form id="total">
        <h3>Points For</h3>
        <table>
          <tr>
            <td><label>Age</label></td>
            <td><input class="sev" name="age" type="text" style="font-size: 15px" value="" size="7" readonly></td>
          </tr>
          <tr>
            <td><label style="font-size: 18px">Your Education</label></td>
          </tr>
          <tr>
            <td><label>Education 1</label></td>
            <td><input class="sev" name="ed" type="text" style="font-size: 15px" value="" size="7" readonly></td>
          </tr>
          <tr>
            <td><label>Area of Study</label></td>
            <td><input class="sev" name="aos" type="text" style="font-size: 15px" value="" size="7" readonly></td>
          </tr>
          <tr>
            <td><label style="font-size: 18px">French Proficiency</label></td>
          </tr>
          <tr>
            <td><label>TCFC2</label></td>
            <td><input class="sev" name="tcfc2" type="text" style="font-size: 15px" value="" size="7" readonly></td>
          </tr>
          <tr>
            <td><label style="font-size:20px;"><strong>Total</strong></label></td>
            <td><input class="ten" name="total" type="text" style="font-size: 20px" value="" size="10" readonly></td>
          </tr>
        </table>
      </form>
    </div>
    </body>
    </html>

1 Ответ

4 голосов
/ 03 января 2012

Я не думаю, что это связано с jquery UI, но с линией 

var tcfc2 = parseInt(document.getElementById('form').TCFC2.value, 10) || 0;

так как у вас есть 2 элемента с переключателями под названием TCFC2, с ними создается массив. Кроме того, значение всегда равно 1 для первого радио и 2 для второго. Вам нужно проверить свойство «флажок», а не значение, чтобы определить, говорят ли люди по-французски. 

var tcfc2 = document.getElementById('form').TCFC2[0].checked -0 ;

Нет parseInt, так как "true" или "false" возвращаются, "-0" для принудительного преобразования int.

Наконец, я бы переименовал радиостанции ИЛИ текст ввода типа во что-то еще, кроме TCFC2. (и объедините ваш css, получите сценарии и стили из файла html и в свои собственные файлы для обслуживания кола, и назовите ваши переменные более значимыми, чем a, b и c ...)

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

Похожие темы

...