테스트 사이트 - 개발 중인 베타 버전입니다

간단한 자바스크립트 질문이요 ㅜㅜ

완초 3년 전 조회 1,896

그누보드q&a에 올릴만한 질문은 아닌데 어디 여쭤볼 데가 없어서 올립니다 ㅜ.ㅜ

일단 저는 자바스크립트 완~~~~전 초보구요... 거의 모르는수준이라고 보셔도 됩니다

 

input창에 글씨가 한 글자라도 입력됐다면 x버튼이 뜨고, 글씨가 하나도 없으면 그 버튼이 없어지는 것을 만들고 싶습니다.

 

<input type="text" id="" name="" class="search_field" value="">

<button class="reset" onclick="clearInput()">x</button>

 

인풋창이랑 버튼이구요... input의 value 길이가 0이면 버튼을 안보이게, 한글자 이상이면 버튼이 나오게... 이런 접근으로 서치하면서 어찌저찌 입력해보았습니다

 

 var el = document.getElementsByClassName('search_field');

 var res = document.getElementsByClassName('reset');

 

    if(el.value.length < 0.1){

        res.style.display = 'none';

    } else {

        res.style.display = 'block';

    };

 

그래서 이렇게 해보았는데 음 , , ,역시 안됩니다

제가 자바스크립트는 정말 모르겠어서 질문 올립니다 ㅜ 읽어주셔서 감사합니다

 

 

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

el 또는 res 라는 동일이름을 가진 변수나 아이디가 있나 확인해보고 그게 존재한다면 제 코드에서 아이디를 다른 이름으로 바꿔보세요

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

</p>

<p><input type="text" id="el" name="" class="search_field" value="">

<button class="reset" id="res" style=display:none onclick="clearInput()">x</button>

<script>

el.onkeyup = function() {

    res.style.display = el.value.trim() == "" ? "none" : "inline-block";

}

</script></p>

<p>

 

http://www.mediaplayer.kr/main/bbs/html_editor.php

좌측장에 코드 넣고 결과확인 해 보세요.

 

글구 이런 건 어떤 측면에서 보면 쉬운 게 절대 아니에요.

또 아이디가 아니라 클래스로 땡기려면 [0] 이나 [1] 같은 배열원소를 같이 붙여야 합니다.

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

완초
3년 전
안녕하세요! 일단 너무 감사드립니다
보내주신 링크에서도 잘 먹히고 html에 따로 빼서 쳐봤을 때도 잘 먹히는데...
제가 만들고있는 연습용 html에선 저게 안먹히네요ㅜㅜ 다른곳에서 잘되는거 보니까 코드문제는 아닌것같은데 경로문제일까요?,, 인풋이랑 버튼이 특정 태그로 감싸져있어서 그런가요 음 상관없는거같은데 ㅜㅜ

아 그리고 제가 저거를 레이어팝업에다가 적용시키려고하는데 이런거랑은 상관없는거죠..?ㅠ

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인