表格模式按预期工作

任何人都可以告诉我我的模式有什么问题，或者我正在做其他一些事情。表格模式按预期工作

First have look at the code

<style> 
 
     input:invalid ~ span:before { 
 
        content: "not good"; 
 
       } 
 
       input:valid ~ span:before { 
 
        content: "good"; 
 
       } 
 
       input { 
 
        display: block; 
 
       } 
 
     </style> 
 
     <form action=""> 
 
       <input type="text" 
 
pattern="(?=^.{8,}$)((?=.*\d)|(?=.*\W+))(?![.\n])(?=.*[A-Z])(?=.*[a-z]).*$ 
 
     "><span> </span> 
 
       </form>

有关模式，我想的是，我不知道模式输入字段必须包含一个小写，一个大写字母和一个数字或一个特殊字符顺便说一下，

所以在我这样的价值这样@ 9aLkfjakdj应该显示我good，意味着我的输入是正确的。

但是只要我运行我的代码，它试图杀死我，它显示我good，意味着什么他们是什么都没有在输入字段为什么它说这一切都很好，比不管我输入输入字段它总是告诉我not good，

我基本上是如果输入字段的是，风格说正确显示我文字好，当它不显示我的文字不好，

谢谢

来源

2017-10-18 user2860957

输入类型（如email或text）是可选的，所以这就是为什么值开始为“好”而不是“不好”的原因。

此处了解详情：https://css-tricks.com/almanac/selectors/v/valid/

<style> 
 
    input:invalid ~ span:before { 
 
       content: "not good"; 
 
      } 
 
      input:valid ~ span:before { 
 
       content: "good"; 
 
      } 
 
      input { 
 
       display: block; 
 
      } 
 
</style> 
 
<form action=""> 
 
    <input type="text" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}" required > 
 
    <span></span> 
 
</form>

来源

2017-10-18 23:33:10

我为什么要使用的密码类型，什么是你的模式和我之间的不同？ – user2860957

不是他们是我的模式有些事情，因为你的模式工作正常，删除更新的评论，因为你错了，只是检查你自己的代码，只是留下评论使用这个或其他的东西，我会接受你的解决方案，因为你的代码工作正常， – user2860957

我编辑你的答案我自己现在我接受它。谢谢，接受我的编辑或编辑你的自我 – user2860957

表格模式按预期工作

回答

相关问题