Отображаемый результат не отображается - PullRequest
Новая
       1

Отображаемый результат не отображается

0 голосов
/ 09 июля 2020

Помогите, пожалуйста! Я пытался создать веб-приложение для определения права на получение мини-кредита, используя JavaScript, но моя проблема в том, что результат отображения не отображал то, что кажется, после нажатия кнопки права на получение кредита.

Ниже мои * Код 1011 * и JavaScript. 

 


let Amount = document.querySelector("#amount").value;
let Duration = document.querySelector("#years").value;
let amt = parseInt(Amount);
let dura = parseInt(Duration);
let Message = document.querySelector("#result");
//const Income =  parseInt(Amount.value);
//const Years  = parseInt(Duration.value);
function eligibility(){
if(amt < parseInt(50000) ){
    Message.textContent = "Please! You're not eligible for the loan";
   // console.log('Try again')
} else if(amt >= parseInt(50000) ) {
    Message.textContent = "Please Fill the form below and apply"
  //  console.log('Please Fill the form below and apply')
}
}
<html>
<form action="" role="form">
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon">
                            <span class="glyphicon glyphicon-plus"></span>
                            </span>
                            <input type="number" class="form-control" placeholder="Income"  id="amount" required  />
                        </div>
            
            
            
                    </div>
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon">
                            <span class="glyphicon glyphicon-time"></span>
                            </span>
                            <input type="number" class="form-control" placeholder="Duration" id="years"  required  />

                        </div>
                    </div>


<button type="" class="btn btn-primary btn-block"  onclick="eligibility()">Check Eligibility</button>
  
                    <div id="result">
                        
                    </div>

                </form>
        
        </html>

1 Ответ

2 голосов
/ 09 июля 2020

Основная проблема заключалась в том, что вам нужно было объявить эти входные значения внутри функции, которую вы вызываете при нажатии кнопки. В противном случае все они будут установлены на значение, которое они загружают как (null)

Я изменил часть вашего кода и добавил комментарии. Надеюсь, это поможет 

<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>

<html>
<form action="" role="form">
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon">
                            <span class="glyphicon glyphicon-plus"></span>
                            </span>
                            <input type="number" class="form-control" placeholder="Income"  id="amount" required  />
                        </div>
            
            
            
                    </div>
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon">
                            <span class="glyphicon glyphicon-time"></span>
                            </span>
                            <input type="number" class="form-control" placeholder="Duration" id="years"  required  />

                        </div>
                    </div>


<button type="" class="btn btn-primary btn-block"  onclick="eligibility()">Check Eligibility</button>
  
                    <div id="result">
                        
                    </div>

                </form>
        
        </html>
<script type="text/javascript">


//const Income =  parseInt(Amount.value);
//const Years  = parseInt(Duration.value);



function eligibility(){
    //You need the declare these values inside the function (getting them globally will only get the value they are when page loads up)
    let Amount = document.querySelector("#amount").value;
    let Duration = document.querySelector("#years").value;
    let amt = parseInt(Amount);
    let dura = parseInt(Duration);
    let Message = document.querySelector("#result");
    if(amt < 50000){
        Message.innerText = "Please! You're not eligible for the loan";
       // console.log('Try again')
    }
    //Change this else-if to just an else since you are just checking for the exact opposite of your if statement
    else{
        Message.innerText = "Please Fill the form below and apply"
      //  console.log('Please Fill the form below and apply')
    }   
}

//Prevent form from submitted or else page will reload and no message would be shown
document.querySelector('form').addEventListener('submit', (e)=>{
    e.preventDefault();
});

    
</script>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...