Умножить число с Input и вывести в другой Input (PHP+JS)

Question

Умножить число с Input и вывести в другой Input (PHP+JS)

Рейтинг: 1Ответов: 1Опубликовано: 21.02.2023

Всем привет, Есть у меня код:

<?php
$get = file_get_contents ("https://min-api.cryptocompare.com/data/price?fsym=BTC&tsyms=USD,EUR,ETH,LTC,DASH,DOGE,ZEC,XMR,XRP,BCH,USDT");

$ticker = json_decode($get,true);

$priceUSD =  $ticker['USD'];
?>

Который парсит цену 1 BTC в USD

Полученную сумму я вывожу на страницу вот так:

PRICE USD: <?=$priceUSD;?>

Теперь, у меня есть два INPUT

BTC
USD

И нужно чтобы количество которое я ввожу в INPUT 1 умножалось на число которе я вывожу здесь:ъ

<?=$priceUSD;?>

Ну и обратно. Заранее спасибо большое!

javascript html php input

Источник: Stack Overflow на русском

Answer 1

▲ 1Принят

Вот так можно реализовать, работает в две стороны BTC to USD и USD to BTC:

<?php

$get = file_get_contents("https://min-api.cryptocompare.com/data/price?fsym=BTC&tsyms=USD,EUR,ETH,LTC,DASH,DOGE,ZEC,XMR,XRP,BCH,USDT");

$ticker = json_decode($get, true);

$priceUSD = !empty($ticker['USD']) ? $ticker['USD'] : 0;

?>
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Converter</title>
    <script src="https://code.jquery.com/jquery-3.6.3.min.js"
            integrity="sha256-pvPw+upLPUjgMXY0G+8O0xUf+/Im1MZjXxxgOcBQBXU=" crossorigin="anonymous"></script>
</head>
<body>
<h1>Converter</h1>
<label for="js-input-btc">
    BTC
    <input type="number" id="js-input-btc" placeholder="BTC" value="1">
</label>
<br>
<br>
<label for="js-input-usd">
    USD
    <input type="hidden" id="js-input-single-price-usd" value="<?= $priceUSD ?>">
    <input type="number" id="js-input-usd" placeholder="USD">
</label>

<script>
    $(document).ready(function () {

        function handleInputs() {

            // constant value: 1 btc = xxx $
            var $inputSingleUSD = $('#js-input-single-price-usd');

            var $inputBTC = $('#js-input-btc');

            var $inputUSD = $('#js-input-usd');

            var btcOnChangeHandler = function (inputBtcValue) {

                var btcValue = Number.parseFloat(inputBtcValue);

                if (btcValue <= 0 || isNaN(btcValue)) {
                    $inputUSD.val('');
                    return;
                }

                var priceForSingleBtc = Number.parseFloat($inputSingleUSD.val());

                var result = btcValue * priceForSingleBtc;

                // round result to 2 chars
                result = Math.floor(result * 100) / 100;

                $inputUSD.val(result);

            };

            var usdOnChangeHandler = function (inputUsdValue) {

                var usdValue = Number.parseFloat(inputUsdValue);

                if (usdValue <= 0 || isNaN(usdValue)) {
                    $inputBTC.val('');
                    return;
                }

                var priceForSingleBtc = Number.parseFloat($inputSingleUSD.val());

                var result = usdValue / priceForSingleBtc;

                // round result to 4 chars
                result = Math.floor(result * 10000) / 10000;

                $inputBTC.val(result);

            };

            // first call, when the app loaded
            btcOnChangeHandler($inputBTC.val());

            // onchange handler for input #js-input-btc
            $inputBTC.on('input', function (event) {
                btcOnChangeHandler(event.target.value);
            });

            // onchange handler for input #js-input-usd
            $inputUSD.on('input', function (event) {
                usdOnChangeHandler(event.target.value);
            });

        }

        handleInputs();

    });
</script>

</body>
</html>

Умножить число с Input и вывести в другой Input (PHP+JS)

Ответы