JavaScript работает только после обновления

Question

У меня проблема. Я работаю над следующим кодом. В нем есть функция калькулятора, выполненная с использованием JavaScript. Я еще не получил jQuery. Он работает, но он делает это только при обновлении страницы. Страница представляет собой файл .php. Я не знаю, связано ли это с тем, или что на странице есть запросы php или базы данных, или что-то действительно.

страница организована следующим образом:

<div> 

<div> 

<?php -> catch $_POST values from another page -> some database query(select->echo selected item->turn item into $var) ?> 

    <div style="background: white; box-shadow: 1px 1px 2px; width: 200px; padding: 10px; float: right; margin-top: -125px; margin-right: -10px; height: 150px;">  

    <input type="radio" name="opcao" id="opCart" >Cartão<br> 
    <input type="radio" name="opcao" id="opDin">Dinheiro<br> 

    <input type="text" id="cholerie" style="width: 70px;" required> 
    <input type="submit" id="calcular" onclick="calcula()" value="calcular"> Resultado: <p id="resultado"></p> 
</div> 

    <script> 
     var preco = <?php echo $array[preco]; ?> ; 
     var pagamento = document.getElementById("cholerie").value; 
     var troco = Number(preco) + Number(pagamento); 
     function calcula(){ 
      document.getElementById("resultado").innerHTML = troco; 
     } 
    </script> 

< some form to catch $_POST values from the database query > 

<div> </div> 
mysqli_close($conn); 

Я думаю, что вопрос является яваскриптом и связанной с ним формой.

Answer 1

php запускается только при перезагрузке страницы. если вам нужно обновить страницу без перезагрузки, вам нужно использовать ajax для отправки асинхронного запроса на php-страницу и обновления ваших данных.

Answer 2

Я тоже считаю, что ответ Дмитрия прав, как вы получите данные в реальном времени, не перезагружая страницу? Вы можете использовать AJAX, хотя, как он предложил, так что продолжайте читать и читайте на AJAX на google