test.gif
    完整代码

    1. <!DOCTYPE html>
    2. <html lang="en">
    3. <head>
    4. <meta charset="UTF-8">
    5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
    6. <meta http-equiv="X-UA-Compatible" content="ie=edge">
    7. <title>Document</title>
    8. <script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>
    9. </head>
    10. <body>
    11. <!-- 身份证号匹配
    12. 18位
    13. ....x
    14. \d{17}[0-9xX]
    15. -->
    16. <div id="app">
    17. <input type="text" v-model="keyword" @keyup.enter="handleEnter">
    18. </div>
    19. <script>
    20. new Vue({
    21. el:"#app",
    22. data:{
    23. keyword:""
    24. },
    25. methods: {
    26. handleEnter(){
    27. var reg=/^\d{17}[0-9xX]$/;
    28. if(!reg.test(this.keyword.trim())){ //trim()去除空格
    29. alert("身份证号码不正确")
    30. }
    31. }
    32. },
    33. })
    34. </script>
    35. </body>
    36. </html>