2015-11-30 2 views
0

Я пытаюсь выполнить расчет с использованием JavaScript. Когда пользователь вводит менее 10 страниц ввода (#page), стоимость равна 1. Если он добавляет более 10, каждая страница стоит .10. есть 2 опции для флажка, если он первый раз щелкнет, будет добавлен флажок 10 и добавлен второй флажок 15.JavaScript Расчет неправильный

Это работает, когда это делается в последовательных шагах. (ввод затем щелчок).

Ex: входной сигнал: 9 (всего: 1) нажмите CheckBox1 - дубликаты (всего: 11) нажмите CheckBox1 - лазер (всего: 26)

Теперь, если я изменить вход 11, то общий становится 1,10 - даже если обе галочки проверяются .. (ожидаемый результат должен быть - 26,10)

Я не знаю, как это сделать ... может кто-нибудь помочь мне

<html> 
<head> 
    <title>Calculation</title> 
    <script> 
     function calculate() { 
      var pages=document.getElementById("page").value; 

      if(pages <=10) { 
       total.value=1; 
      } 
      if(pages >= 11) { 
       var extra_pages= pages - 10; 
       var new_total= extra_pages * .10; 
       var new_total1= 1 + new_total; 
       total.value= new_total1; 
      } 
     } 

     function checkbox1() { 
      if(document.getElementById("ckbox1").checked === true) { 
       var total1=document.getElementById("total").value; 
       const add1 = 10; 
       var check1 = +total1 + +add1; 
       total.value=check1; 
      } 
      if(document.getElementById("ckbox1").checked === false) { 
       var total1=document.getElementById("total").value; 
       const sub1 = 10; 
       var check2 = +total1 - +sub1; 
       total.value = check2; 
      } 
     } 

     function checkbox2() { 
      if(document.getElementById("ckbox2").checked === true) { 
       var total1=document.getElementById("total").value; 
       const add1 = 15; 
       var check1 = +total1 + +add1; 
       total.value=check1; 
      } 
      if(document.getElementById("ckbox2").checked === false) { 
       var total1=document.getElementById("total").value; 
       const sub1 = 15; 
       var check2 = +total1 - +sub1; 
       total.value = check2; 
      } 
     } 
</script> 
<body> 
    Enter a Number: <input type="text" id="page" value="1" oninput="calculate()"> 
    <br> 
    <br><br><br><br> 
     duplicates <input type="checkbox" id="ckbox1" onclick="checkbox1()"> 
    laser print: <input type="checkbox" id="ckbox2" onclick="checkbox2()"> <br><br> 
    Total: <input type="text" id="total"> 
</body> 
</html> 
+0

Ваш 'calculate' не считал' 'duplicates' и лазерную print', поэтому они не будут включены. – fuyushimoya

+0

Вы не указали total.value – WisdmLabs

ответ

0

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

// Get reference to inputs. 
 
var page = document.getElementById("page"); 
 
var total = document.getElementById("total"); 
 
var dup = document.getElementById("ckbox1"); 
 
var laser = document.getElementById("ckbox2"); 
 

 
function calculate() { 
 
    // To Number 
 
    var pages = parseInt(page.value, 10); 
 
    var value = 0; 
 

 
    if (pages <= 10) { 
 
    value = 1; 
 
    } else { 
 
    var extra_pages = pages - 10; 
 
    var new_total = extra_pages * .10; 
 
    var new_total1 = 1 + new_total; 
 
    value = new_total1; 
 
    } 
 
    
 
    // Add 10 if dup is checked. 
 
    if (dup.checked) { 
 
    value += 10; 
 
    } 
 
    
 
    // Add 15 if laser is checked. 
 
    // These can be moved out like 
 
    // const laserVal = 15; 
 
    // value += laserVal if you don't want magic number here. 
 
    if (laser.checked) { 
 
    value += 15; 
 
    } 
 
    
 
    // Truncate float. 
 
    total.value = value.toFixed(1); 
 
}
Enter a Number: 
 
<input type="text" id="page" value="1" oninput="calculate()"> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
duplicates:<input type="checkbox" id="ckbox1" onclick="calculate()"> 
 
laser print:<input type="checkbox" id="ckbox2" onclick="calculate()"> 
 
<br> 
 
<br>Total: 
 
<input type="text" id="total">

+0

Привет, я пробовал этот код ... но это не работает для меня ... – JavaLearner1

+0

Откройте инструмент dev, есть ли что-нибудь на консоли? Какая информация о том, что не работает, изменить страницы, не изменит общий итог? Или нажмите на флажок, не получится правильно? или даже не добавляя номер? – fuyushimoya

+0

Можете ли вы проверить здесь, пожалуйста, я скопировал код и попытался ... но когда я ввожу входные данные ... все пусто .. Также, когда я нажимаю флажок. Это поле пусто. - http://jsfiddle.net/ vikrams/a3khbub1/ – JavaLearner1

Смежные вопросы