2010-02-08 4 views
0

자바 스크립트를 사용하여 src를 변경하는 중 ... 너비와 높이 속성이 처음 올바르게 설정됩니다. 두 번째로 그들은 변화하지 않습니다. 왜?img src 속성을 설정할 때 너비와 높이가 변하지 않습니다.

그래서 ... <img id="imgCropImage" />

내 페이지에 빈 이미지를 가지고 그래서 아이디어 때마다 사용자가, 업 로더의 UploadComplete 콜백가 가지고있는 이미지에이 이미지의 SRC를 설정합니다 이미지를 업로드한다는 것입니다 방금 업로드하여자를 수 있습니다. 그런 다음이 이미지의 높이너비 속성을 사용하여 자르기 미리보기를 만들 수 있습니다.

위대한 작품입니다. 브라우저 또는 DOM 또는 뭔가은 이미지가로드 된 후 DOM을 통해 액세스하는 img의 높이 및 너비 특성을 자동으로 설정합니다. 아름다워.

사용자가 잘못된 이미지를 업로드 한 경우 다른 이미지를 업로드 할 수있게하려고합니다. 그러나 이번에는 javascript를 통해 액세스되는 img의 width 및 height 속성은 이전 이미지와 동일하게 유지됩니다. 새 이미지는 태그의 속성이 새 src와 함께 변경되지 않는 것이므로 태그의 너비와 높이가 올바르게 표시됩니다.

왜 이런 일이 발생하는지 알고 있습니까? 아니면 더 나은, 어떻게 결정적으로 새로운 src를로드 할 때 img의 높이와 너비를 얻을 수 있습니까?

I < 3 3 stackoverflow 및 I < 3.

+0

또한 CSS 높이 및 너비 스타일을 설정하면 DOM에서이 값을 반환합니다. – HaterTot

답변

2

높이 및 너비 특성을 "제거"하는 경우는 어떻게됩니까?

$('#imgCropImage').removeAttr('height'); 
$('#imgCropImage').removeAttr('width'); 

"재설정"해야합니다. (JQuery를 사용하고 있다면).

+0

그 트릭을 했어, 감사합니다 – HaterTot

2

이전 이미지를 새 이미지로 바꾸려고 했습니까? 새 이미지로 바꾸시겠습니까?

var newImg = document.createElement('IMG'); 
    newImg.src = newSrc; 
    oldImg.parentNode.replaceChild(newImg, oldImg); 
+0

이 작동 할 것이라고 확신하지만 난 지저분하기 때문에 자바 스크립트를 사용하여 요소를 추가/제거에서 멀리하려고합니다. – HaterTot

관련 문제