Notice
Recent Posts
Recent Comments
Link
250x250
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
Tags
- React onClick
- javascript React
- couchcoding
- 자바스크립트배포
- useEffect
- db.json
- first-child
- JSON
- redux 사용방법
- 협업프로젝트
- foreach
- 인라인블럭
- sort
- react redux
- redux toolkit
- React state
- 카우치코딩
- javascript코딩테스트
- JavaScript
- 블럭요소
- Redux store
- react
- useSearchParams
- 자바스크립트
- useParams
- line-through
- 콜백함수
- toString
- 6주포트폴리오
- Redux
Archives
- Today
- Total
개발하는 루루언니
javascript & jQurey : input 안에 readonly 값 추가 삭제 본문
728x90
반응형
[HTML]
<label> 아이디</label>
<input type="text" id="userid" name="userid" class="form-control form-md" value="<?php echo $me['userid']; ?>">
</div>
<div class="form-row">
<label>현재 비밀번호</label>
<div class="input-group">
<input type="password" id="passwd0" name="passwd0" class="form-control form-md" value="" >
<input type="button" id="default_passwd" name="defalte_passwd" value="확인"/>
</div>
<div class="clearfix"></div>
</div>
<div class="form-row">
<label>신규 비밀번호</label>
<div class="input-group">
<input type="password" id="passwd" name="passwd" class="form-control form-md" value="" readonly>
<button class="btn btn-form" type="button" id="change-passwd">
<span class="material-icons">cached</span>
</button>
<div class="form-text info" id="pw-text">영문 소문자,숫자,기호 조합 8자리 이상, 20자까지 </div>
</div>
<div class="clearfix"></div>
</div>
<div class="form-row">
<label>신규 비밀번호 재입력</label>
<input type="password" id="passwd1" name="passwd1" class="form-control form-md" value=""readonly>
<div class="form-text" id="pw1-text"></div>
<div class="clearfix"></div>
</div>
[JS]
$("#default_passwd").click(()=>{
console.log("실행");
let userid = document.getElementById("userid").value;
let passwd = document.getElementById("passwd0").value; //현재 비밀번호
let data = "mode=check_userid&userid="+userid+"&passwd="+passwd;
console.log(data);
$.post("act.php",data , function(r) {
if(r.result == "OK") {
$("#passwd").attr('readonly',false);
$("#passwd1").attr('readonly',false);
alert(r.msg);
return false;
} else {
alert(r.msg);
$("#passwd").attr('readonly',true);
$("#passwd1").attr('readonly',true);
return false;
}
},"JSON")
})
1. 현재 비밀번호가 맞는지 확인하는 버튼을 눌렀을때 ("#default_passwd"); 맞다면?
2. 새로운 비밀번호 / 새로운 비밀번호 확인 인풋박스를 id 값을 가져와 readonly 값을 제거해준다. false
$(아이디값).attr ('readonly', false) / true 를 하면 readonly 값을 붙혀준다.
728x90
'컴퓨터 정보 > javascript' 카테고리의 다른 글
JQuery : 플러스 마이너스 버튼 여러개 따로 동작하게 하기 (2) | 2024.02.07 |
---|---|
JQuery : 체크박스 클릭시 특정 블럭 감추가 보이기 (1) | 2024.02.07 |
페이지 새로고침 (0) | 2024.01.16 |
javascript : select_box 년도별로 나오게 하기 (0) | 2024.01.16 |
Jquery : selectBox 에서 option 의 text, value 값 가져오기 (0) | 2024.01.10 |