Как передать значение переменной из функции JS

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

Есть код:

<script>
function onInput() {
    var input = document.getElementById("input");
    var div = document.getElementById("test");
    if (div != null && input != null)
        div.innerHTML = input.value;
}
</script>
<script>
// получаем значения в донат форму :)
$('.donateatr').on('click', function () {
    // создаем переменные
    var button = $(event.relatedTarget);
    var tovarImage = $(this).data('image')
    var tovarName = $(this).data('name')
    document.querySelector('.tovarName').innerHTML = tovarName;
    var tovarCode = $(this).data('code')
    var tovarPrice = $(this).data('price')
    var tovarNormal = $(this).data('normal')
    var tovarServer = $(this).data('server')
    var tovarCategory = $(this).data('category')
    var tovarId = $(this).data('tovarid')
    var tovarDescription = $(this).data('description')
    document.querySelector('.description').innerHTML = tovarDescription;
    // создаем строчки для вставки в донатформу (информация о товаре)
    $('#tovarImage').html('<img src="'+ tovarImage +'" style="display: block; margin: 0 auto;" alt="...">')
    $('#tovarNameUp').html('<h4>'+ tovarName +'</h4>');
    $('#tovarCode').html('<button class="btn btn-secondary" data-bs-toggle="modal" data-bs-target="#opisanie_form" href="#" target="" style="display: block; margin: 0 auto;" type="submit"><i class="fa fa-book" aria-hidden="true"></i>&nbsp; Описание и возможности</button>');
    $('#tovarPriceDown').html('<p>К оплате: &emsp;'+ tovarPrice +' рублей</p>');
    $('#tovarServer').html('<p>Режим: '+ tovarServer +'</p>');
    $('#tovarServerHidden').html('<input style="display: none;" type="text" name="server" value="'+ tovarServer +'">');
    $('#tovarCategory').html('<p>Категория: '+ tovarCategory +'</p>');
    // создаем строчки для вставки в донатформу (ввод информации о игроке)
    $('#setNick').html('<input type="text" class="form-control form-input setnick" name="name" placeholder="Например: DSK_a" required>');
    $('#setAm').html('<input type="number" id="input" class="form-control form-input" name="amount" placeholder="Например: 12" oninput="onInput();"/>');
    $('#tovarNameDown').html('<input class="form-control" style="display: none;" type="text" name="tovar" value="'+ tovarId +'">');
    $('#tovarNameHidden').html('<input class="form-control" type="text" value="'+ tovarName +'" readonly>');
    $('#setPromo').html('<input type="text" class="form-control form-input" name="promo" placeholder="XXXXXXX">');
    $('#tovarPriceUp').html('<p style="font-size: 17px; font-family: Gilroy Bold; margin-top: 30px;" >Стоимость товара: <s>'+ tovarNormal +'</s> <b>'+ tovarPrice +'</b>₽</p>');
});
</script>

Первый скрипт замечательно передаёт данные из input в div. Но как мне подставить эти данные вместо tovarNormal (последняя строка). Перед этим умножив tovarNormal на значение из input?

Ответы

▲ 0Принят

Переменная объявленная через var доступна из любого скрипта, при условии что она объявлена не внури функции или блочной области. Следовательно лучше вынести эти переменные из функций в скрипт.

<script type="text/javascript">
    var tovarNormal; // это объявление глобальной переменной доступной везде    
</script>

Раз уж вам пришлось работать с jquery хорошо было бы изучить его методы для изменения значений в элементах DOM дерева.

function onInput() {
    var input = document.getElementById("input");
    var div = document.getElementById("test");
    if (div != null && input != null)
        div.innerHTML = input.value;
        $('#tovarPriceUp') // тут заполняем
          .html('<p>Стоимость товара: <b>'+ tovarNormal * input.value +'</b>₽</p>');

}