최신 브라우저의 스타일 입력 버튼과 관련된 CSS, Javascript 기능 문제가 있습니까? (IE 8/9, FF 9)

양식의 일부인 입력 단추 (CSS를 사용하여 스타일 지정)가있는 사이트에서 작업하고 있습니다. 예를 들어, 샘플 코드최신 브라우저의 스타일 입력 버튼과 관련된 CSS, Javascript 기능 문제가 있습니까? (IE 8/9, FF 9)

<input type="submit" name="buttonSave" value="save" id="buttonsavejs" class="button_image button_style"/>

은 아래를 참조 난 그냥 사용자가 버튼을 클릭하면, 그 아래에 몇 픽셀을 이동하는 문제를 발견하고 작업이 수행 간헐적으로 소요 예상했습니다. 하지만 간헐적 인은 가끔씩 작동하여 (사용자를 다음 페이지로 리디렉션 함) 때로는 아무 일도 일어나지 않는다는 것을 의미합니다.

이전에 작업 한 개발자는 코드를 많이 문서화하지 않았으므로 여기서 처음부터 작업하려고합니다 (세부 정보가 부족함). 어쨌든, 코드를 테스트 한 후, 새로운 브라우저가 CSS와 자바 스크립트를 렌더링하는 방법에 문제가있는 것처럼 보입니다. 여기

버튼의 기능 뒤에 자바 스크립트의 코드 조각입니다 :

$("#buttonsavejs").click(function(){ 
     $("#main").unbind("submit").submit();

그리고 스타일 버튼 또한

.button_style { 
    height:28px; 
    margin-left:10px; 
    position:relative; 
    right:10px; 
    top:-23px; 
    width:100px; 
} 

.button_image { 
    background-image:url(http://some_image); 
    border-bottom-width:0; 
    border-color:initial; 
    border-image:initial; 
    border-left-width:0; 
    border-right-width:0; 
    border-style:initial; 
    border-top-width:0; 
    display:block; 
    font-size:1px; 
    line-height:1px; 
    outline-color:initial; 
    outline-style:none; 
    outline-width:initial; 
    overflow-x:hidden; 
    overflow-y:hidden; 
    position:relative; 
    text-indent:-9999px; 
}

는 CSS, 난 아주 비슷한 질문이 여기에 질문주의 : Why do mouse clicks not always work for styled input buttons?

내가 지금까지 찾을 수 있었던 또 다른 조각. IE 9의 개발자 도구에서 문서 모드를 IE 8이나 9 이외의 것으로 전환하면 단추가 제대로 동작합니다. IE8 browser mode vs document mode

질문을 : :에서 테스트 후 그래서 내가 가지고있는 생각의 한 줄은 IE 7에 X-UA 호환을 설정하고, 분명히, 즉 IE에서 문서 모드가 작동하는 방법으로 그가 해결되는지 확인하는 것입니다 FF (이전 버전 < 9.0), IE 7, 버튼이 제대로 작동하는지 확인했습니다. 그러나 FF 9, 크롬 16, IE 8/9에서는 위에서 설명한대로 동작합니다. 비슷한 문제가있는 사람이 있습니까?

출처

2012-01-12 Ray

그 질문에 게시 대답은 같다 :

<input type="button" />

사용

<button type="button">bla bla bla</button> // you can use type="submit"

및 스크립트

올바른 방향으로 당신을 가리 키기 위해 ('p 장소 : 상대적 물건). 그걸 탐구하기 위해 당신은 무엇을 했습니까? –

궁금한 점이 있는데 왜 초기 값을 '초기'로 재설정 했습니까? 좀 더 일반적인 스타일을 다른 값으로 설정 했습니까? – BoltClock

@BoltClock : 이렇게 코딩 된 이유는 확실하지 않습니다. 그러나 나는 이것이 문제와 관련이 있다고 생각하지 않는다. – Ray

쉬운 수정 :

먼저 사용하지 마십시오

이

$("#buttonsavejs").click(function(e){ 
    e.preventDefault(); // this stops the button from doing it's default action, aka submit.

출처

2012-02-06 22:31:08

최신 브라우저의 스타일 입력 버튼과 관련된 CSS, Javascript 기능 문제가 있습니까? (IE 8/9, FF 9)

답변

관련 문제