2012-01-07 4 views
4

크롬에는 잘 작동하지만 IE 또는 Firefox에는 링크가 없습니다. 당신이 그들을 클릭하면 아무 일도 일어나지 않습니다. CSS (z-index 포함)가 엉망 이었지만 아이디어가 없습니다. 이것은 Drupal에서 나오는 XHTML입니다.Firefox, IE에서 버튼 링크가 작동하지 않습니다.

HTML은 다음과 같습니다 : 내가 볼 수있는 위치에 대한

<div class="product-display-block-link"> 
    <button> 
    <a href="/checkout/outfield-banner/1">Add to cart</a> 
    </button> 
</div> 

어떤 제안?

+0

나는 너의 href에있는 경로를 의심한다. 체크 아웃이 같은 폴더에 있습니까? – DOK

답변

12

HMTL 구문이 button 요소 내에서 a 요소를 허용하지 않기 때문에 브라우저에서 작동하지 않는 것은 놀라운 일이 아니다 : 요소의 definition 명시 적으로 제외됩니다. 그러한 구조를 사용할 이유가 없어야합니다. 수행하려는 작업에 따라 단추 모양처럼 링크를 스타일링하거나 단추와 동작을 연관시킬 수 있기 때문입니다.

+0

"또는 버튼과 함께 동작을 연관시킵니다."- 예를 들어 주시겠습니까? –

+3

예 :''. –

1

<button>을 올바르게 사용하고 있지 않습니다.

HTML : 당신이 버튼 (에서 자바 스크립트와 양식을 제출하거나 매달려 즉 일을)하려면, http://jsfiddle.net/s8jtf/

+1

당신이 왜 투표를하지 않았는지 확실하지 않습니다. 이것은 제가 찾고있는 것입니다. – abriggs

3

버튼을 사용

<div class="product-display-block-link"> 
    <button onClick="javascript: window.location='/checkout/outfield-banner/1'">Add to Cart</button> 
</div> 

여기에 행동을 참조하십시오. 링크가 필요하면 링크를 사용하십시오. 버튼처럼 보이는 링크를 원한다면 링크를 사용하여 원하는 모양으로 스타일을 지정하십시오.

<button> 요소에 <a> 요소를 포함 할 수 없으므로 둘을 혼합 할 수 없습니다.

<!-- 
Content is %Flow; excluding a, form and form controls 
--> 
<!ELEMENT button %button.content;> <!-- push button --> 

<!ENTITY % button.content 
    "(#PCDATA | p | %heading; | div | %lists; | %blocktext; | 
    table | %special; | %fontstyle; | %phrase; | %misc;)*"> 
+0

이것은 XHTML1.0뿐만 아니라 [HTML5] (http://dev.w3.org/html5/spec/the-button-element.html)에서도 마찬가지입니다. – You

+0

(X) HTML의 모든 버전에 해당됩니다. 나는 XHTML을 언급 한 이후로 XHTML 1.0을 참조했다. – Quentin

-1

또한 type 속성이 없습니다. 다른 브라우저는 다른 유형을 가정합니다 (예 : type = "submit").

+0

제출 상태는 [

+0

브라우저가 전송을 가정하지 않으면 깨졌습니다. 관련 양식이없는 것 같으므로 어쨌든 재연되지는 않습니다. – Quentin

+0

불행히도 브라우저의 차이점을 고려해야합니다. 관련성이없는 제출에 관해서는, 양식이 javascript없이 작동하는 솔루션 중 하나 일 수 있다고 생각하고있었습니다 (관련성이 있거나 그렇지 않을 수 있음). –

관련 문제