Question

我尝试使用min值验证一些必填字段。我有几个输入。如何进行验证以显示或隐藏每个输入的.min_val - 类似closest('.min_val')。

我试过了$this('closest').('.min_value').css('display','none');，但它没有用。在这种情况下，如果我未填写所有输入，则会显示min_val条消息。应为每个输入显示这些消息，而与其他输入无关。怎么做？

我的代码是：

＆＃13;

$(".orders-div :input").each(function () {
  var min = $(this).attr('data-min-val');
  var value = $(this).val();
  
  if(min !== undefined && min !== null && min !== false) {
    if(value < min) {
      $(this).addClass('error');
      $(this).closest('label').addClass('red');
      $('.min_value').css('display','block');
    }
  }

＆＃13;

<div class="span2">
<label for="quantity">
    <?php echo __('Quantity'); ?>
    <span class="red">*</span>
    <span class="min_value red" style="display:none"><?php echo __('Required min value:'); ?> 1</span>
</label>

<input data-min-val='1' class="span12 required" type="text" name="quantity">
</div>

＆＃13;

Answer 1

您可以使用纯HTML：

<input type="number" name="quantity" min="1" max="5">

当提交表单时，浏览器将检查输入是否为数字，以及是否介于1和5之间。如果不是，则会抛出错误。

http://jsfiddle.net/ydowpz6r/

Answer 2

由于HTML的设置方式，您需要遍历DOM以获得所需的.min_value范围。

试试这个：

$(".orders-div :input").each(function () {
  var min = $(this).attr('data-min-val');
  var value = $(this).val();

  if(min !== undefined && min !== null && min !== false) {
    if(value < min) {
      $(this).addClass('error');
      $(this).closest('label').addClass('red').find('.min_value').css('display', 'block');
    }
  }

这将找到最近标签中包含的.min_value范围。

如何用明确的类隐藏或显示最接近的跨度

2 个答案: