Функция не работает - JavaScript, Ajax

spoon100500 · 19.10.2016, 09:09

В коде js функция function dtCalc() не работает, может кто подскажет?

Код HTML:

<!doctype html>
<html lang="ru">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">
<meta charset="utf-8">
</head>
<body>
<input type="number" id="editbox1" name="Ширина изделия" value="0.4" autocomplete="off" title="Ширина изделия, мм"  min="0.4" max="4" step="0.01">
<input type="number" id="editbox2" name="Высота изделия" value="0.4" autocomplete="off" title="Высота изделия, мм"  min="0.4" max="4" step="0.01">
<button id="AdvancedButton1" type="button" name="la" value="500">
</button>
<button id="AdvancedButton2" type="button" name="la" value="520" onclick="myFunc(this)">
</button>
<button id="AdvancedButton3" type="button" name="la" value="520" onclick="myFunc(this)">
</button>
<button id="AdvancedButton7" type="button" name="la" value="650" onclick="myFunc(this)">
</button>
<button id="AdvancedButton8" type="button" name="la" value="650" onclick="myFunc(this)">
</button>
<button id="AdvancedButton9" type="button" name="la" value="650" onclick="myFunc(this)">
</button>
<button id="AdvancedButton10" type="button" name="la" value="560" onclick="myFunc(this)">
</button>
<div id="wb_result" class="style3">
&nbsp;</div>
<div id="wb_correct1" class="style2">
<span><strong> Ширина от 0,4 до 4 м</strong></span></div>
<div id="wb_correct2" class="style2">
<span><strong> Высота от 0,4 до 4 м</strong></span></div>
<div id="wb_rulonkiBreadcrumb1">
</div>
<input type="checkbox" id="check" name="ck" value="on">
<div id="wb_zk" class="style3">
&nbsp;</div>
<div id="wb_calcText2">
</div>
<script type="text/javascript">

        var checkValue = function (value) {
        var correct = false;
        value = parseFloat(value.replace(',', '.'));
 
        if(!isNaN(value)) {
          correct = (value >= 0.4 && value <= 4);
        }
 
        return correct ? 'Верно' : 'Введите от 0,4 до 4';
      }

      var ensureMinMaxValue = function () {
      var value = document.getElementById('editbox1').value;
      document.getElementById('wb_correct1').innerHTML = checkValue(value);
      var value = document.getElementById('editbox2').value;
      document.getElementById('wb_correct2').innerHTML = checkValue(value);
}
       
        function myFunc () {
        var editbox1 = parseFloat(document.getElementById('editbox1').value);
        var editbox2 = parseFloat(document.getElementById('editbox2').value);
        var buttonValue = parseFloat(this.value);
        var wb_result = document.getElementById('wb_result');
		var result = (editbox1 * editbox2 * buttonValue).toFixed(2);
        wb_result.innerHTML = result;
      };
 
      var buttons = document.querySelectorAll('[id^="AdvancedButton"]');
      btnsLength = buttons.length;
      for(var i = 0; i < btnsLength; i++) {
      var btn = buttons[i];
      btn.onclick = myFunc;
      }
 
      var editBoxes = document.querySelectorAll('input[type="number"]');
      editBoxesLength = editBoxes.length;
      for(var i = 0; i < editBoxesLength; i++) {
        var edit = editBoxes[i];
        edit.onkeyup = ensureMinMaxValue;
        edit.onchange = ensureMinMaxValue;
      }

     resField = document.getElementById('wb_zk'),
     ckeckBox = document.getElementById('check'),
     resFieldFirstVal = resField.innerHTML,
     counts = [2, 3, 4, 5];

ckeckBox.addEventListener('change', showHideRes.bind());
//ckeckBox.addEventListener('change', stCalc.bind());
ckeckBox.addEventListener('change', dtCalc.bind());
editbox1.addEventListener('input', stCalc.bind());

 
function showHideRes(elem) {
  if (ckeckBox.checked){
    resField.style.display = 'block';
  } else {
    resField.innerHTML = resFieldFirstVal;
    resField.style.display = 'none';
  }
}
 
function stCalc() {
  if (ckeckBox.checked) {
    if (editbox1.value >= 0.4 && editbox1.value <= 1.8) {
      resField.innerHTML = counts[0];
    } else if (editbox1.value >= 1.81 && editbox1.value <= 2.5) {
      resField.innerHTML = counts[1];
    } else if (editbox1.value >= 2.51 && editbox1.value <= 3.5) {
      resField.innerHTML = counts[2];
    } else if (editbox1.value >= 3.51 && editbox1.value <= 4) {
      resField.innerHTML = counts[3];
    }
  }
}

function dtCalc()	{ //resultdiv wb-result inner
    var
    s = [60, 90, 120, 150],
    k = stCalc();
 
            for(var i = 0, l = s.length; i < l ; i+=1){
                if(k === counts[i]){
				if(checkbox.checked){
                    return (s[i] + myFunc).toFixed(2);
					} else {
					return myFunc;
                }
				}
            };
    };
</script>
</body>
</html>

Serge_Bliznykov · 19.10.2016, 09:58

Цитата:

Код:

ckeckBox.addEventListener('change', showHideRes.bind());
//ckeckBox.addEventListener('change', stCalc.bind());
ckeckBox.addEventListener('change', dtCalc.bind());

А что, можно на одно и то же событие одного контрола (ckeckBox) назначать два разных обработчика?
и, главное, зачем такое извращение?

spoon100500 · 19.10.2016, 10:08

Согласен, корява пока, но думаю проблема не в этом.
Если оставить обработки один ckeckBox.addEventListener('change', dtCalc.bind());
то всё ровно не работает.

Alex11223 · 19.10.2016, 10:10

Цитата:

Сообщение от Serge_Bliznykov

А что, можно на одно и то же событие одного контрола (ckeckBox) назначать два разных обработчика?

конечно можно, add же

https://jsfiddle.net/h58f0r31/

Serge_Bliznykov · 19.10.2016, 11:24

Цитата:

Сообщение от spoon100500

Согласен, корява пока, но думаю проблема не в этом.
Если оставить обработки один ckeckBox.addEventListener('change', dtCalc.bind());
то всё ровно не работает.

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

Цитата:

Сообщение от Alex11223

конечно можно, add же

вижу, действительно. спасибо.

spoon100500 · 19.10.2016, 11:39

Цитата:

Сообщение от Serge_Bliznykov

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

Ставим галочку на чекбокс запускается функция function dtCalc() и function showHideRes(elem).
function showHideRes(elem)-как вы поняли скрывает и показывает поле resField.

функция function dtCalc()-прибавляет числа 60, 90, 120, 150 по условию, к результату result т.е. если 2 то прибавляем 60 к результату result, если 3 прибавляем 90 к result и т.д.
При снятии галочки с чекбокса jcnftncz njkmrj result/

Serge_Bliznykov · 19.10.2016, 11:45

извините, но интерфейс просто ужасный...

но суть не в этом.

открываем dtCalc()

видим k = stCalc();

смотрим функцию stCalc()
видим, что она НИЧЕГО не возвращает.
что, по вашему, будет в k после выполнения stCalc() ?!

дальше.
смотрим, что же делает dtCalc()

она ВОЗВРАЩАЕТ какие-то значения
return ....

А кому она это возвращает?!

spoon100500 · 19.10.2016, 11:53

Т.е. что типо этого нужно сделать

Код:

function stCalc() {//resultfield wb-zk inner
        
        var i = getNodeState(editbox1,"value")(); 
		
            if (i < 0.4 || i > 4){
                console.log("fatal");
                return;
            }else if( i <= 1.8) {
                return counts[0];
            } else if (i <= 2.5) {
                return counts[1];
            } else if (i <= 3.5) {
                return counts[2];
            } else if (i <= 4) {
                return counts[3];
            };
    };

spoon100500 · 19.10.2016, 11:56

Или да же так

Код:

function stCalc( bool ) {//resultfield wb-zk inner
        
        var i = getNodeState(firstField,"value")(); 
		
            if (i < 0.4 || i > 4){
                console.log("fatal");
                return;
            }else if( i <= 1.8) {
                return counts[0];
            } else if (i <= 2.5) {
                return counts[1];
            } else if (i <= 3.5) {
                return counts[2];
            } else if (i <= 4) {
                return counts[3];
            };
    };
 
 
    function dtCalc( bool )	{ //resultdiv wb-result inner
    var
    s = [60, 90, 120, 150],
    k = stCalc( bool )
    ;
 
            for(var i = 0, l = s.length; i < l ; i+=1){
                if(k === counts[i]){
				if(checkbox.checked){
 
 
                    return (s[i] + getResult()).toFixed(2);
					} else {
					return getResult();
                     }
		}
            };
 
    };

Serge_Bliznykov · 19.10.2016, 11:56

после того, как исправите (если исправите, конечно)
функцию stCalc(), чтобы она возвращала значение.

у Вас будет ошибка в этой строке:

Цитата:

Код:

				if(ckeckbox.checked){
                    return (s[i] + myFunc).toFixed(2);
					} else {
					return myFunc;

потому что нет ckeckbox, а есть ckeckBox

а потом будет ошибка в строке

Цитата:

Код:

return (s[i] + myFunc).toFixed(2);

19.10.2016, 10:08	#3
spoon100500 Форумчанин Регистрация: 14.10.2016 Сообщений: 406	Согласен, корява пока, но думаю проблема не в этом. Если оставить обработки один ckeckBox.addEventListener('change', dtCalc.bind()); то всё ровно не работает. Еду медленно, но верно! Последний раз редактировалось spoon100500; 19.10.2016 в 10:15.

19.10.2016, 11:45	#7
Serge_Bliznykov Старожил Регистрация: 09.01.2008 Сообщений: 26,229	извините, но интерфейс просто ужасный... но суть не в этом. открываем dtCalc() видим k = stCalc(); смотрим функцию stCalc() видим, что она НИЧЕГО не возвращает. что, по вашему, будет в k после выполнения stCalc() ?! дальше. смотрим, что же делает dtCalc() она ВОЗВРАЩАЕТ какие-то значения return .... А кому она это возвращает?! Последний раз редактировалось Serge_Bliznykov; 19.10.2016 в 11:48.

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Не работает функция	mazanakee	Visual C++	0	22.02.2015 19:20
Sendmail работает, функция mail() работает, но есть проблема.	PavelNAndreev	PHP	8	27.01.2014 12:45
Не работает функция	kakawkin	Общие вопросы Delphi	3	28.05.2011 15:09
не работает функция	Benderbej	JavaScript, Ajax	2	30.08.2010 18:54
Не работает функция gets()!!!	Ilya'91	Общие вопросы C/C++	1	28.07.2008 23:16