javascript - JQuery 输入消息

Question

我有一个带有输入的表单。第一个输入需要在第二个输入之前填写。

如果用户先点击输入 2，他们会收到一条消息，提示先填写另一个输入。现在我想做到这一点，以便在弹出消息后，如果用户随后填写输入 1，消息就会消失。

My codepen .

我尝试添加一个 onchange 函数，但这似乎不起作用。

$('body').on('focus', '.clickable', function() {
  if (!$('.look').val().length) {
    $(this).siblings('p').text('Please select Type first')
  }
});
$('body').on('change', '.look', function() {
  if ($('.look').val().length) {
    $(this).siblings('p').text('')
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <div>
    Input-1:<br>
    <input type="text" name="first" id="one" class="look"><br> Input-2:
    <br>
    <input class="clickable" type="text" name="second" id="two">
    <p class="warning"></p>
  </div>

</form>

Answer 1

在您离开输入时调用更改，您的代码在离开输入时工作，您也可以通过 keyup 更改“on change”以查看更改而无需离开输入

codepen : https://codepen.io/anon/pen/QOzKwQ