자리 표시자는 HTML5에 추가 된 또 다른 속성입니다. 입력 또는 TextArea 가이 속성을 설정하면이 값의 내용이 텍스트 상자에 회색 단어 프롬프트로 표시됩니다. 텍스트 상자가 초점을 맞출 때 프롬프트 텍스트가 사라집니다. 과거에는이 효과가 JavaScript를 사용하여이를 제어하여 달성되었습니다. Firefox, Google Chrome 등에 대한 지원을 표현했지만 IE는 지원하지 않습니다.
HTML5는 Input의 새로운 유형 유형, 양식 검증 등과 같은 웹 양식을 많이 향상 시켰습니다.
자리 표시자는 HTML5에 추가 된 또 다른 속성입니다. 입력 또는 TextArea 가이 속성을 설정하면이 값의 내용이 텍스트 상자에 회색 단어 프롬프트로 표시됩니다. 텍스트 상자가 초점을 맞출 때 프롬프트 텍스트가 사라집니다. 과거에는 JavaScript를 사용 하여이 효과를 제어하여 달성했습니다. Firefox, Google Chrome 등은 이에 대한 지원을 표현했지만 즉, 불일치를 느꼈습니다!
예 : <입력 ID = T1 Type = Text 자리 표시 자 = 텍스트를 입력하십시오/
여기에는 IE에 따라 자리 표시자를 지원하는 매우 강력한 속성 플러그인이 소개되며 자리 표시자를 지원하지 않는 다른 브라우저와도 호환됩니다. 코드는 다음과 같습니다.
$ (document) .ready (function () {var doc = document, inputs = doc.getElementsByTagName ( 'input'), supplatePlaceHolder = 'placeHolder'in doc.createElement ('input '), placeholder = function (input) {var text = input.getAttribute ('placeHolder '), defaultValue = input.defaultValue. if (defaultValue == '') {input.value = text} input.onfocus = function () {if (input.value === 텍스트) {this.value = ''}}; if (! supplationholder) {for (var i = 0, len = inputs.length; i <len; i ++) {var input = inputs [i], text = input.getAttribute ( 'pluteholder');코드를 복사하여 JS 파일 참조에 저장하면 처리하지 않고 매우 편리합니다!
예 : 실제로 IE 입력이 자리 표시 자 속성을 표시 할 수 있지만 페이지에 입력이 하나만 있으면 괜찮습니다. 여러 입력이있는 경우 입력이 값을 채우지 않으면 빈 입력이 자동으로 자리 표시기 값을 값으로 채우므로 오류가 발생합니다. 예를 들어:
<입력 유형 = 텍스트 자리 표시 자 = 입력 제품 인코딩 이름 = goodscode id = goodscode value = 123 /> <입력 유형 = 텍스트 자리 표시기 = 입력 제품 이름 = goodsname id = goodsname value = 입력 제품 이름 />
해결책은 백그라운드에서 직접 판단하는 것입니다. 위의 JS 파일에서 해결할 수 있고 나중에 조사 할 수 있습니다 ~!