Обновлен HTML из переменной JavaScript

Вместо document.write было бы лучше обновить или добавить элемент на странице.

Например, изменив предоставленный код и разметку:

Javascript (jQuery)

$(document).ready(function(e) {
    $('.content_window').css('height','900');
    $('#top').css('float','none');

    $('#shutter').on("change", function(e) {
        var shutter_price = $(this).val()*200;
        if (shutter_price >= 0) {
            $('#shutter-result').text(shutter_price);
        }
    });
});

HTML

<label for="shutter">shutter </label>
<input style="margin-right:98px" name="shutter" type="number" id="shutter" min="0" step="1" pattern="\d+" />

<div id="shutter-result"></div>

JSFiddle

Я набрал весь расчет. У меня есть кнопка submmision, которая, нажав, должна извлечь сумму. он не работает... im довольно новый в javascript, поэтому я не могу сказать, где проблема. вот код:

$('#home_price').submit(function(){
var shutter_price, lights_price, socket_price, screen10_price, screen7_price, dimmer_price, x
var total_price = 3000;
    shutter_price = ($('#shutter').val())*200;
    light_price = ($('#lights').val())*200;
    socket_price = ($('#socket').val())*200;
    screen10_price = ($('#screen10').val())*700;
screen7_price = ($('#screen7').val())*200;
dimmer_price = ($('#dimmer').val())*400;
if($('#boiler').is(":checked")==true){
    total_price+=600;
    x+=1;
}
x+=($('#shutter').val())*2+($('#lights').val())+($('#socket').val());
Math.floor(x);
x+=1;
total_price = total_price + shutter_price + light_price + socket_price + screen10_price + screen7_price +           dimmer_price + x*400;
$('#home_pricing').val()=total_price;
if($('#home_pricing').val() < 6000)
    alert('the solution invalid');
else
    alert(" total: " + $('#home_pricing').val());
});
});

и часть html-кода:

<label for="screen7"> 7inch screen </label> 
<input style="margin-right:70px" name="screen7" type="number" id="screen7"> <br><br> 
    <label for="dimmer"> dimmer</label> 
    <input style="margin-right:174px" name="dimmer" type="number" id="dimmer"> <br><br> 
    <label for="boiler"> bolier </label>
    <input style="margin-right:148px" type="checkbox" name="boiler" id="boiler" > <br><br> 
    <div>
    <input type="submit" name=" home_pricing " id="home_pricing" value=" calculate " >
    </div>
    </form>

любое предложение о том, как сделать вычисление и получить окно предупреждения или другое окно с ответом?

Тпх

Я думаю, вы можете создать div в своем HTML и использовать: $('#id_of_div_where_you_want_to_write').html("text you want to write");

ps Это javascript javascript! = java o/

Надеюсь, это поможет брату!

Я знаю, что вы не сказали, что используете jquery, но я бы очень его возобновил, потому что он делает javascript намного проще. Если вам нужно отобразить это значение для пользователя, вы можете использовать функцию jquery html. Вот ссылка, https://api.jquery.com/html/. Я бы просто записал значение в div, который должен отображать ответ.

Дайте мне знать, если вам это нужно, и я могу дать вам быстрый плункер.