Skip to content

기글하드웨어기글하드웨어

인터넷 / 소프트웨어 : 윈도우즈, 리눅스, 기타 운영체제, 각종 어플리케이션, 프로그램, 소프트웨어, 인터넷, 인터넷 서비스에 대한 이야기, 소식, 테스트, 정보를 올리는 게시판입니다.

Extra Form

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<script>

window.onload = function(){

function clicked(){

var btn = document.getElementById("button");

btn.value = "Clicked";

}

}

</script>

</head>

<body>

<input id="button" type="button" value="Not clicked" onclick="clicked()">

</body>

</html>

 

 

자바스크립트 이제 막 배우기 시작한 뉴비입니다.

버튼 하나 만들어서 버튼 클릭하면 Clicked 함수를 호출하면서 버튼 내용이 Clicked라고 바뀌는 간단한 프로그램인데요.

어떻게 수정해야 제대로 작동을 할지 도저히 모르겠네요.

으앙 ;ㅅ;

 



  • profile
    click 2020.05.12 17:45
    현재 clicked() 함수는 익명 함수 내부의 멤버 함수로 정의되어있어서 접근하실 수가 없네요.
    밖에 나와있어서 테스트해볼 수가 없는데 window.onload 줄을 지우고 function clicked()를 외부로 빼주시면 아마 동작할겁니다
  • profile
    부녀자 2020.05.12 17:48
    앗 답변 감사합니다. 말씀하신대로 했더니 작동하네요.
  • profile
    title: 부장님오노데라코사키      おのでらちゃんマジ天使! 2020.05.12 17:48
    window.onload = function(){
    }
    로 둘러싸인것을 지우시면 됩니다.
  • profile
    부녀자 2020.05.12 18:30
    답변 감사합니다.
  • profile
    마커스 2020.05.12 17:52
    근본적으로 clicked 함수가 window.onload = function() { ... } 함수의 의 스코프 안에 들어있기 때문에, 즉 Anonymous 함수의 지역 변수이기 때문에 <input>의 DOM 단위에서는 접근할 수 없는 것입니다. 굳이 window가 onload된 이후에만 click 이벤트를 받아들일 필요가 없다면 window.onload = function() { ... } 를 벗겨주시면 되고, 그게 아니라면 clicked를 <script>의 바로 하단에서 먼저 (일종의) 전역 변수로 지정해 주신 다음 onload시에 function() { ... } 을 걸어주는 방법 등이 있을 것 같습니다.
  • ?
    포인트 팡팡! 2020.05.12 17:52
    마커스님 축하합니다.
    팡팡!에 당첨되어 10포인트를 보너스로 받으셨습니다.
  • profile
    마커스 2020.05.12 17:55
    개인적으로 저라면 event listener를 달아 주는 방향으로 갈 것 같습니다. 예시: https://jsfiddle.net/4Lw9nk0e/
  • profile
    부녀자 2020.05.12 18:31
    답변 감사합니다.
    음... 이벤트 리스너 사용법을 배워야 겠네요
  • profile
    쮸쀼쮸쀼 2020.05.12 20:17
    사실 버튼에 [onclick="clicked()"] 이거 넣어준 것도 이벤트 리스너 등록입니다. 다만 마커스님이 말씀하신 것은 이벤트 리스너 등록 부분까지도 순전히 자바스크립트 코드에서 처리하도록 한다는 것이지요.

작성된지 4주일이 지난 글에는 새 코멘트를 달 수 없습니다.


  1. 반기가 인터넷 소감

    100Mb 인터넷으로는 시스템 한대에 업데이트 깔고 게임 설치하는데 이틀이 걸립니다. 켜놓고 자도 말이죠. 주변에서 500Mb로 올리니 삶의 질이 달라졌다는 평이 하도 많아서, 한달에 만원씩 더 내고 쓰기로 했습니다. 신청 자체는 5월 첫...
    Date2020.05.13 일반 By낄낄 Reply14 Views2133 file
    Read More
  2. 트위터, 의견이 덧붙여진 리트윗을 모아보는 기능 추가

    트위터에는 리트윗 기능과 함께 '의견을 추가하여 리트윗하기'를 통해 의견을 덧붙여 리트윗할 수 있는 기능이 있습니다. 인용 리트윗이라는 이름으로도 불립니다.   그동안 작성자가 받는 알림 외에는 검색을 통해서만 찾아볼 수 있었지...
    Date2020.05.13 소식 By이견 Reply0 Views529 file
    Read More
  3. No Image

    자바스크립트 완전 초보 질문

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script> window.onload = function(){ function clicked(){ var btn = document.getElementB...
    Date2020.05.12 질문 By부녀자 Reply9 Views416
    Read More
  4. Vultr 서울 리전 정식 런칭

      다들 아시는 그 Vultr가 오늘 서울 리전(IDC)를 정식 런칭했습니다. 며칠 전에 런칭 예정이라는 소식 글(https://gigglehd.com/gg/soft/7266357)이 올라왔었는데, 마침내 수면 위로 모습을 드러냈군요. 사실 저도 나름 이쪽 바닥에 관...
    Date2020.05.12 소식 Bytitle: 몰?루유키나 Reply12 Views939 file
    Read More
  5. 라이젠용 DRAM 계산기 1.7.2 버전 발표

    라이젠용 DRAM 계산기 1.7.2 버전이 나왔습니다. 삼성 B 다이, 마이크론 E 다이, 하이닉스 CJR의 프리셋 재작업, R-XMP과 익스트림 계산 버튼 제거, DRAM PCB 리비전, 마이크론 E 다이 OC 보조 추가, 삼성 B 다이의 OC 보조 교정 등이 있...
    Date2020.05.11 소식 By낄낄 Reply2 Views1164 file
    Read More
  6. 줌, 암호화 기능 강화를 위해 키베이스 인수

    줌은 SNS 연동 공개 키 기반 구조와 터미널 사이의 암호화 메세징을 제공하는 키베이스를 인수했다고 발표했습니다. 이걸로 암호화 기능을 계속해서 강화해 나갈 방침입니다. 지금의 줌 서버는 암호화 키를 만들고 기능을 사용하기 위해 ...
    Date2020.05.11 소식 By낄낄 Reply2 Views325 file
    Read More
  7. No Image

    백신추천좀 부탁드립니다

    원래는 백신없이 깡으로 사용중이였습니다 디펜더도 고전게임이나 동인게임 usb에 담아놧다가 가끔 꺼내서 할때 지맘대로 격리시켜버리고 예외지정을해도 얼마안있다가 또 격리시켜서 그냥 꺼버리고살고있었는대 오늘갑자기 중학교때 한번...
    Date2020.05.09 질문 Bytitle: 몰?루knock Reply24 Views1280
    Read More
  8. No Image

    MS, 아이패드용 오피스 앱에 트랙패드 지원 추가 예정

    마이크로소프트는 올해 가을에 아이패드용 워드, 엑셀, 파워포인트 앱에 트랙패드와 마우스 지원을 추가할 계획입니다. 아이패드OS는 지난 4~5년 동안 출시된 모든 아이패드에 트랙패드와 마우스 지원을 추가했습니다.
    Date2020.05.09 소식 By낄낄 Reply1 Views480
    Read More
  9. No Image

    국내 호스팅사 (주)아이네임즈 랜섬웨어 감염

    (주)아이네임즈 에서는 보안 부분과 데이터 백업을 철저히 시행하였으나 악의적인 해커의 공격으로 인해 2020년 5월 8일 19시경  웹호스팅 서버의 일부가 랜섬웨어에 감염되었음을 확인하였습니다. 랜섬웨어 공격 발견 즉시 인터넷진흥원...
    Date2020.05.09 소식 Bytitle: 가난한카토메구미 Reply10 Views1000
    Read More
  10. No Image

    트위터 구버전 웹이 완전 종료될 예정

    트위터는 새로운 트위터 웹을 순차적으로 적용하기 시작해 모든 사용자에게 일괄적으로 적용했습니다. 다만 브라우저 쿼리 변경 또는 이를 제공하는 확장 프로그램, 오래된 브라우저를 통해 구버전의 트위터를 사용할 수는 있었습니다.   ...
    Date2020.05.09 소식 By이견 Reply1 Views1530
    Read More
  11. Vultr이 한국 IDC를 런칭하려는 모양입니다.

    모두들 아시는 그 Vultr이 한국 IDC를 곧 런칭 하려나 봅니다. 혹시 회사를 이용하시는 분들 있으시면 참고 하셨으면 좋겠습니다!   오늘 부로 Seoul이 추가되었습니다.
    Date2020.05.08 소식 By이선예 Reply5 Views1277 file
    Read More
  12. office 365 personal/home 구독 관련 질문

    오피스 365 퍼스널을 패키지로 사서 지금까지 잘 쓰고 있었는데 요새 패키지 가격이 상당히 올라서 공홈에서 직접 결제하는거랑 맞먹는 가격이 될 정도여서, 부담이 많이 되더군요..   그래서 아는 지인분이 365 홈을 산다길래 저도 가족...
    Date2020.05.08 질문 By케닌 Reply1 Views450 file
    Read More
  13. 구글 렌즈, 이미지에서 글자를 인식해 복사/붙여넣는 기능

    구글 렌즈에 새로운 기능이 추가됐습니다. 이미지의 글자를 구글 렌즈가 인식해서 선택하는 기능은 이미 있었으나, 이번에는 그 내용을 PC로 복사해서 붙여넣는 옵션이 추가됐습니다. 구글 렌즈에서 텍스트 부분을 선택하면 '컴퓨터로...
    Date2020.05.08 소식 By낄낄 Reply4 Views745 file
    Read More
  14. No Image

    bash 스크립트로 생성된 한글명 파일이 삼바 폴더에서 제대로 표시되지 않습니다

    라즈베이파이에 우분투 서버 올리고 이것저것 해보는 중입니다.   삼바와 FTP 올려놓고 사용 중이며 제가 만든 bash 스크립트로 생성되는 파일이 있습니다. 다음 스크립트입니다. (되는대로 만든거라 이상할 수도 있으니 넘어가 주시길..)...
    Date2020.05.08 질문 By실핀 Reply6 Views656
    Read More
  15. MariaDB datadir 이전 과정에서 오류

      증상. 참고/링크에 있는 가이드를 참고하여 MariaDB에서 DB가 저장되는 위치를 바꿨습니다. 그러니 "Can't create test file /media/jieey11/Database/redredgroup_sql_databases/mysql/REDREDGROUP-System.lower-test" 라면서 MariaDB...
    Date2020.05.07 질문 By하스웰 Reply28 Views1330 file
    Read More
목록
Board Pagination Prev 1 ... 352 353 354 355 356 357 358 359 360 361 ... 579 Next
/ 579

최근 코멘트 30개

MSI 코리아
AMD
한미마이크로닉스
더함

공지사항        사이트 약관        개인정보취급방침       신고와 건의


기글하드웨어는 2006년 6월 28일에 개설된 컴퓨터, 하드웨어, 모바일, 스마트폰, 게임, 소프트웨어, 디지털 카메라 관련 뉴스와 정보, 사용기를 공유하는 커뮤니티 사이트입니다.
개인 정보 보호, 개인 및 단체의 권리 침해, 사이트 운영, 관리, 제휴와 광고 관련 문의는 이메일로 보내주세요. 관리자 이메일

sketchbook5, 스케치북5

sketchbook5, 스케치북5

나눔글꼴 설치 안내


이 PC에는 나눔글꼴이 설치되어 있지 않습니다.

이 사이트를 나눔글꼴로 보기 위해서는
나눔글꼴을 설치해야 합니다.

설치 취소