굉장히 이상한 거 공유?

예제를 보여드리기 힘들어서 압축파일로 공유합니다. 소스코드를 보시면 알겠지만, 아주 간단한 코드입니다.

STEP

#01. Open "1.html"

#02. Click "move"

#03. Move "2.html"

#04. Click System Prev Button (브라우저의 이전 페이지 버튼)

#05. Click System Next Button (브라우저의 다음 페이지 버튼)

이렇게 해보면 브라우저의 이전>다음으로 2.html에 가면 희한하게 2째줄 2번째 textarea에도 "DDD"가 박혀있습니다.

이전>다음을 또 해보면 2째줄 1번째 textarea에도 "DDD"가 박혀있습니다.

명확한 원인은 모르겠지만, 현상은

textarea를 다시 그리는 스크립트가 있는 경우 textarea의 값을 val()로 조작하는 경우 name attribute가 없으면 그 위의 name이 있는 textarea까지 찾아 올라가면서 바꾸는듯

input은 안 그러고,

text()로 하면 안 그러고,

Pure JavaScript의 value도 동일 현상이 있습니다. 즉, jQuery의 버그는 아닙니다.

해결방법은, 이게 왜 이러는지 모르겠지만,

조작하는 2째줄 3번째 textarea에 name attribute를 주면 됩니다. name=""으로 비워도 안되고 값이 있어야합니다.

아니면, 2째줄 2번째 textarea에 name attribute를 주면 막혀서 더는 안그러는듯

현상, 원인, 해결이 다 명확친 않아서 설명이 너무 어렵지만 참으로 신기한 현상입니다.

원인을 찾아보려하지만 뭐라고 검색해야할지 모르겠다는.ㅋ

파폭은 안그러고 해당 버그가 있는 브라우저가 있는듯하네요.

P.S.) name 속성은 당연히 있어야한다는 꼰대 댓글은 거부합니다.