Имеется проект на базовом шаблоне. На главной странице размещен калькулятор затрат на топливо:
Код: Выделить всё
<form action="">
<h4>2. Выберите марку бензина</h4>
<label for="92">92</label>
<input type="radio" name="price" value="42" class="price" id="92" checked>
<label for="95">95</label>
<input type="radio" name="price" value="45" class="price" id="95">
<label for="98">98</label>
<input type="radio" name="price" value="48" class="price" id="98">
<h4>3. Сколько км. вы проезжаете за день?</h4>
<label for="myRange"></label>
<input type="range" name="mileage" min="1" max="500" value="50" step="1" class="slider" id="myRange">
<p>Км: <span id="demo"></span></p>
<h4>4. Укажите расход в км. на 100 литров</h4>
<label for="myRange2"></label>
<input type="range" name="rate" min="1" max="100" value="13" step="1" class="slider" id="myRange2">
<p>Л: <span id="demo2"></span></p>
<input type="button" id="r" name="send" value="Рассчитать" />
<label for="r">Результат:</label>
<input type="text" id="" name="result" placeholder="Ответ" />
</form>
Код: Выделить всё
<?php
namespace app\assets;
use yii\web\AssetBundle;
class PublicAsset extends AssetBundle
{
public $basePath = '@webroot';
public $baseUrl = '@web';
public $css = [
"public_assets/css/bootstrap.css",
"public_assets/js/source/jquery.fancybox.css",
"public_assets/css/animations.min.css",
"public_assets/css/style.css",
];
public $js = [
"public_assets/js/jquery-3.5.1.js",
"public_assets/js/jquery.isotope.js",
"public_assets/js/bootstrap.js",
"public_assets/js/vegas/jquery.vegas.min.js",
"public_assets/js/jquery.easing.min.js",
"public_assets/js/source/jquery.fancybox.js",
"public_assets/js/appear.min.js",
"public_assets/js/animations.min.js",
"public_assets/js/calc.js",
];
public $jsOptions = [
'position' => \yii\web\View::POS_HEAD
];
public $depends = [
];
}
Код: Выделить всё
$(document).ready(function() { // Ждём загрузки страницы
"use strict";
$("input[name=send]").click(function() { // Событие нажатия на кнопку "Расчёт"
var mileage = +$("input[name=mileage]").val(); // Переменная пробега
var rate = +$("input[name=rate]").val(); // Переменная расхода
var volume = mileage * rate * 365 / 100; // Переменная объема топлива за год
var price = +$("input[name=price]:checked").val(); // Переменная цены
var result = volume * price; // Переменная результата
$("input[name=result]").val(result.toFixed()); // записываем результат
});
});
Суть проблемы в том, что калькулятор отрабатывает как положено до того момента, как начинается округление result.toFixed(). Такое ощущение, что функция просто не существует, потому что никак не отрабатывает. Результат постоянно выдается со знаками после запятой. При попытке проверить что возвращает console.log(result) - ноль реакции, в консоли хрома пусто, как будто ничего и быть не должно. И важный момент - в отдельном от проекта обычном файле html данный скрипт работает как часы и console.log() возвращает в консоли хрома любую запрошенную инфу. В чем тут подвох?
Только что проверил, что если скрипт вставить в html коде самой страницы, то всё работает. Вышеуказанные проблемы появляются только если скрипт подключен из отдельного файла через PublicAssets.php