Проверьте, совпадает ли входное значение со значением идентификатора - PullRequest
Новая
       3

Проверьте, совпадает ли входное значение со значением идентификатора

0 голосов
/ 15 октября 2018

Мой первый вопрос на этой платформе.Я работал над формой, которая позволяет пользователю разделить определенное число на меньшее количество групп.Мне не хватает двух вещей, чтобы сделать это завершенным, прежде чем добавлять стили.

Мне нужно сравнить любое заданное число на входе #money с вводом #sum и посмотреть, равны ли они / истинны.

Во-вторых, мне нужно установить min и max для класса targetDiv.Так что пользователь не может установить число больше 100 или меньше 5.

Я новичок в jquery или, по крайней мере, так думаю, поэтому за любую помощь я ценю вас за :) Спасибо!

Ответы [ 2 ]

0 голосов
/ 15 октября 2018

Спасибо!Извините, я забыл указать код: 

$(document).ready(function() {

         $('#showFive').click(function(){
               jQuery('.targetDiv').show();
        });
      $('#showFour').click(function(){
              jQuery('.targetDiv').hide();
              jQuery('#div1,#div2,#div3,#div4').show();
        });
        $('#showThree').click(function(){
              $('.targetDiv').hide();
            $('#div4,#div5').hide();
            $('#div1,#div2,#div3').show();
        });


            $('#div1, #vdiv2, #div3, #div4, #div5').keyup(function(){
               var div1 = parseFloat($('#div1').val()) || 0;
               var div2 = parseFloat($('#div2').val()) || 0;
               var div3 = parseFloat($('#div3').val()) || 0;
               var div4 = parseFloat($('#div4').val()) || 0;
               var div5 = parseFloat($('#div5').val()) || 0;
               $('#sum').val(div1 + div2 + div3 + div4 + div5);       // values (or variables) here
    });
        });
body{
   width:100%;
   height:100%;
   background: #eee;
}
div.menu{

   margin: 5% 10%;
   background: transparent;
}

.targetDiv{
  display:none;
}
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" type="text/css" href="style.css">
  <title>Dividing money</title>
</head>
<body>

  <div>
    <input type="number" id="money" value="100" max="100" readonly />
  <div class="menu">
  <a  id="showThree" target="1">3 boxes</a>
  <a  id="showFour" target="3">4 boxes</a>
  <a  id="showFive">5 boxes</a>
  </div>

  <form>
    <div>
  <input type="number" id="div1" class="targetDiv" placeholder="Number1" min="???" step="0.5"/>
  <input type="number" id="div2" class="targetDiv" placeholder="Number2" min="???" step="0.5"/>
  <input type="number" id="div3" class="targetDiv" placeholder="Number3" min="???" step="0.5"/>
  <input type="number" id="div4" class="targetDiv" placeholder="Number4" min="???" step="0.5"/>
  <input type="number" id="div5" class="targetDiv" placeholder="Number5" min="???" step="0.5"/>
</div>

<input type="number" id="sum"/>


<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="scripts.js"></script>
  </body>

</html>
0 голосов
/ 15 октября 2018

На основе только на предоставленной вами информации:

ИДК, что вы имели в виду по этому поводу:

Мой первый вопрос на этой платформе.Я работал над формой, которая позволяет пользователю разделить определенное число на меньшее количество групп.Мне не хватает двух вещей, чтобы сделать это завершенным, прежде чем добавлять стили.

Но надеюсь, что это поможет вам.

jQuery: 

var money = $("#money").val();
var sum = $("#sum").val();
if(money !== sum){ console.log('true'); }

html:

<input type="number" name="minMaxInput" min="5" min="100">

https://www.w3schools.com/tags/att_input_min.asp

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

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

...