如何在 jquery 验证引擎中指定自定义无效条件？答案

【问题标题】：How to specify custom invalid condition in jquery validation engine?如何在 jquery 验证引擎中指定自定义无效条件？
【发布时间】：2016-06-22 13:39:50
【问题描述】：

我有两个选择框，每个框都有一些值

我想验证条件，如果值 1 大于值 2 中的值，则应显示错误提示并且应不提交表单。

这是代码

$(document).ready(function(){
    $("#formid1").validationEngine('attach');
});

function testfunc(value1id, value2id)
{
    var val1 = $('#'+value1id+'').val();
  var val2 = $('#'+value2id+'').val();
    if(val1 !== '' && val2 !== '')
  {
    if(parseFloat(val1) > parseFloat(val2))
    {
        $('#'+value2id+'').validationEngine('showPrompt', 'Value 1 should be smaller than Value 2', 'error', true);
    }
  }
}

Here是小提琴

代码有效并显示错误提示，但表单提交。

有没有办法告诉验证引擎不仅要显示错误提示，还要验证条件，在满足条件之前不要让表单提交？

【问题讨论】：

标签： javascript jquery validation jquery-validation-engine

【解决方案1】：

是的。它可以完成..您不必为这个功能使用这样的验证引擎..

我只是在您的下拉列表中使用了表单的 onSubmit 事件和required 属性。

检查这个sn-p。我在这里修改了你的小提琴代码..

function testfunc() {
  var val1 = $('#value1select').val();
  var val2 = $('#value2select').val();
  if (val1 !== '' && val2 !== '') {
    if (parseFloat(val1) > parseFloat(val2)) {
      return true;
    } else {
      alert("ERROR PROMPT!")
      return false;
    }
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action='' name="formid1" id="formid1" onSubmit="return testfunc()">
  <br />
  <br />
  <div>
    <table>
      <tr>
        <td>Value 1</td>
        <td>
          <select id="value1select" required >
            <option value="">---Select---</option>
            <option value="-1">-1</option>
            <option value="-2">-2</option>
            <option value="-3">-3</option>
            <option value="-4">-4</option>
            <option value="-5">-5</option>
            <option value="-190">-190</option>
          </select>
        </td>
      </tr>
      <tr>
        <td>Value 2</td>
        <td>
          <select id="value2select" required>
            <option value="">---Select---</option>
            <option value="0">0</option>
            <option value="-1">-1</option>
            <option value="-2">-2</option>
            <option value="-3">-3</option>
            <option value="-4">-4</option>
            <option value="-5">-5</option>
          </select>
        </td>
      </tr>
      <tr>
        <td>
          <input type="submit" value="Submit" />
        </td>
      </tr>
    </table>

  </div>

</form>

【讨论】：