>웹 프론트엔드 >JS 튜토리얼 >IE8_javascript 기술에서 입력의 유형 속성을 수정할 때 오류에 대한 해결 방법

IE8_javascript 기술에서 입력의 유형 속성을 수정할 때 오류에 대한 해결 방법

WBOY
WBOY원래의
2016-05-16 16:36:201451검색

요약:

이제 그림과 같은 요구 사항이 있습니다. 사용자가 일반 텍스트 표시 확인란을 선택하면 사용자가 입력한 비밀번호가 일반 텍스트로 표시되어야 합니다. 확인란을 제거하면 다시 변경해야 합니다. 텍스트를 암호화하려면 먼저 입력 상자 유형을 수정하여 일반 텍스트 또는 암호화 텍스트를 표시할지 여부를 결정해야 합니다. 테스트 결과는 chrome, Firefox 및 ie9입니다. 모두 좋지만 ie8 아래에 오류가 보고됩니다. ie8에서는 입력 수정이 허용되지 않습니다. 마침내 다른 접근 방식을 사용하여 구현되었습니다.

일반 텍스트 표시를 선택한 경우 입력 상자를 type="text"로 바꿉니다. 선택하지 않은 경우 입력 상자를 type="password"로 바꿉니다.

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script src="jquery.min.js"></script>
</head>
<body>
<span id="pass"><input name="password" type="password"></span><label><input type="checkbox" id="show-password">显示明文</label>
<script>
$('#show-password').click(function() {
var inp,cname,val;
if(this.checked) {
inp = $('#pass').children('input');
cname = inp.attr('name');
val = inp.val();
$('#pass').html('<input name="'+cname+'" value="'+val+'" type="text">');
} else {
inp = $('#pass').children('input');
cname = inp.attr('name');
val = inp.val();
$('#pass').html('<input name="'+cname+'" value="'+val+'" type="password">');
}
});
</script>
</body>
</html>

요약:

이 글에는 기술적인 내용은 없지만, 이런 상호 작용이 여전히 존재합니다. 이 글은 주로 IE8 이하의 호환성 문제를 고려하여 작성되었습니다. 프로젝트에 이런 인터랙션이 있다면 참고하셔도 되고, 더 좋은 방법이 있으면 공유해 주시면 됩니다.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.