当按钮位于表单外部时，jQuery验证无效

是因为jQuery验证插件默认只会对表单内部的元素进行验证。当按钮位于表单外部时，验证插件无法正确识别表单元素，导致验证无效。

解决这个问题的方法是使用jQuery的自定义验证规则。可以通过自定义验证规则来验证表单外部的元素。

以下是一个示例代码，演示如何使用自定义验证规则来验证表单外部的按钮：

<!DOCTYPE html>
<html>
<head>
  <title>jQuery验证示例</title>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  <script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js"></script>
  <script>
    // 自定义验证规则
    $.validator.addMethod("customValidation", function(value, element) {
      // 在这里编写验证逻辑，返回true或false
      // 示例：验证输入值是否为数字
      return !isNaN(value);
    }, "请输入有效的数字");

    $(document).ready(function() {
      // 表单验证
      $("#myForm").validate({
        rules: {
          myInput: {
            required: true,
            customValidation: true // 使用自定义验证规则
          }
        },
        messages: {
          myInput: {
            required: "请输入值"
          }
        }
      });
    });
  </script>
</head>
<body>
  <form id="myForm">
    <input type="text" name="myInput" id="myInput" placeholder="请输入值">
    <button type="button" id="myButton">验证</button>
  </form>
</body>
</html>

在上面的示例中，我们通过$.validator.addMethod方法添加了一个名为customValidation的自定义验证规则。在rules中，我们将myInput元素的验证规则设置为required: true和customValidation: true，分别表示必填和自定义验证规则。在messages中，我们定义了验证失败时的错误提示信息。

通过以上代码，无论按钮位于表单内部还是外部，都可以正确进行验证。当点击按钮时，会触发表单验证，并根据自定义验证规则进行验证。

腾讯云相关产品和产品介绍链接地址：