CSS를 통해 입력 상자에 텍스트가 있는지 감지하는 방법이 있나요? :empty
의사 클래스와 [value=""]
를 사용해 보았으나 성공하지 못했습니다. 해결책을 찾을 수 없는 것 같습니다.
비슷한 :checked
및 :indeterminate
와 같은 의사 클래스가 있다는 점을 고려하면 가능할 것 같습니다.
참고: "세련된" 스타일을 위해 이 작업을 수행하고 있으며 JavaScript를 사용할 수 없습니다.
또한 Stylish는 클라이언트측에서 사용자가 제어할 수 없는 페이지에 사용된다는 점에 유의하세요.
유사 클래스를
:placeholder-shown
사용할 수 있습니다. 기술적으로 자리 표시자가 필요하지만 대신 공백을 사용할 수 있습니다.Stylish에서는 CSS가 허용하지 않기 때문에 이 작업을 수행할 수 없습니다.CSS에는
값에 대한 (의사) 선택기가 없습니다.참조:
상태에서만 가능합니다. 이는 CSS에 표시된 노드의:empty
선택기는 입력 값이 아닌 하위 노드에서만 작동합니다.[value=""]
[value=""]
可以工作;但仅适用于初始状态。这是因为CSS所看到的节点的value
属性与节点的value
는작동할 수 있지만초기값
property이 노드의
초기 상태에만 관심이 있는 것이 아니라면값
property(사용자 또는 DOM JavaScript에 의해 변경되고 양식 데이터로 제출됨)과 다르기 때문입니다. .사용자 스크립트나 Greasemonkey 스크립트를사용해야 합니다.다행히 어렵지는 않아요. 다음 스크립트는 Chrome, Greasemonkey 또는 Scriptish가 설치된 Firefox 또는 사용자 스크립트를 지원하는 모든 브라우저(예: IE를 제외한 대부분의 브라우저)에서 작동합니다.
이 jsBin 페이지에서 CSS 제한 사항 및 JavaScript 솔루션 데모를 확인하세요. 으아아아