bootstrapvalidator里面验证ID的坑

bootstrapvalidator(以下简称BV)是一个前端表单验证框架，之前项目用到了，我这篇文章所想记录的是我在用BV的时候踩到的一个小坑。
有一个需求是：验证身份证号码是否合法（暂不需要和DB里的身份证做对比，只验证格式）
我想这么简单的需求应该很好实现吧！
于是乎我就写成了这样：
html如下：

<div class="form-group">
        <input id="id-card-input" type="text" placeholder="请输入身份证号码" name="idCard" class="form-control" maxlength="18"
               required>
      </div>

js如下：

idCard: {
        message: '身份证输入错误，请重新输入',
        validators: {
          notEmpty: {
            message: '此项必填哦'
          },
          id: {
            country:'CN',
            message: '身份证输入错误，请重新输入',
          }
        }
      }

然后去测试，咦~~为啥报错了？我一共测试了5个人的身份证号码，失败了4个。也就是说只验证到一个人的身份证是合法的。所以这样的写法不可取。

我自己的身份证.png

百度了一下，已经有人说了，这个框架没有办法正确验证中国人的ID card.
于是我又想到用正则来验证，不用他提供的id验证的方法。
js如下

 regexp: {
            regexp:'/(^\d{15}$)|(^\d{17}([0-9]|X)$)/',
            message: '身份证输入错误，请重新输入'
          }

然后还是报错，啥都不能验证了。这是为啥？难道是我写错了吗？换了几个写法也不对，不晓得。我正准备换一个写法，单独写一个function来处理这里的时候，我想了想，不应该啊！为何这么简单的一个需求BV实现不了呢？
于是乎我又试了一下h5的写法，把正则表达式写在h5里面。

<div class="form-group">
        <input id="id-card-input" type="text" placeholder="请输入身份证号码" name="idCard" class="form-control" maxlength="18"
               pattern="(^\d{15}$)|(^\d{17}([0-9]|X)$)" required>
      </div>

and then,test says successful！
可以正确验证身份证号码。
目的达到了。但是为何写在js里不行，html里面就可以的原因，我还是不晓得。
如果有看官明了的话，求指教。
（以上纯粹个人浅显踩坑经验，希望对你有用。如果有需要校正的地方，欢迎大方提出。☺）