[html 오류] id와 함수명 같을때 (form태그, input태그)

- form 태그안에 input 태그에서 id와 함수명이 같은경우 오류가 발생한다.

// Uncaught TypeError: short is not a function at HTMLInputElement.onclick 

// html
    <form>
        <input type="button" id="short" value="short" onclick="short()">
    </form>
</body>

// javascript
    function short() {
    	console.log('hi');
    }

해결 방법

1. 클릭 이벤트 함수 호출시 window.short()로 작성

// html
    <form>
        <input type="button" id="short" value="short" onclick="window.short()">
    </form>
</body>

// javascript
    function short() {
    	console.log('hi');
    }

 

2. id와 함수 이름 다르게 작성하기

// html
    <form>
        <input type="button" id="short" value="short" onclick="shorts()">
    </form>
</body>

// javascript
    function shorts() {
    	console.log('hi');
    }