나는 다음을하고있다 :
<a href="www.stackoverflow.com">
<button disabled="disabled" >ABC</button>
</a> 이것은 잘 작동하지만 “요소 ‘버튼’이 요소 ‘버튼’안에 중첩되어서는 안된다는 HTML5 유효성 검사 오류가 발생합니다.
누구든지 내가해야 할 일에 대해 조언을 줄 수 있습니까?
답변
아니요 , W3C 의 HTML5 사양 문서 에 따르면 유효한 HTML5가 아닙니다 .
콘텐츠 모델 : 투명 하지만 대화 형 콘텐츠 하위 항목 이 없어야합니다 .
대화 형 컨텐츠가없는 한 (예 : 단추 또는 기타 링크) 전체 단락, 목록, 표 등 전체를 감싸는 요소가있을 수 있습니다.
즉, <a>다음을 제외한 모든 요소를 중첩 할 수 있습니다 .
-
<a> -
<audio>( controls 속성이있는 경우) -
<button> -
<details> -
<embed> -
<iframe> -
<img>( usemap 속성이있는 경우) -
<input>( type 속성이 숨겨진 상태 가 아닌 경우 ) -
<keygen> -
<label> -
<menu>( type 속성이 툴바 상태 인 경우) -
<object>( usemap 속성이있는 경우) -
<select> -
<textarea> -
<video>( controls 속성이있는 경우)
어딘가에 연결되는 버튼을 사용하려는 경우 다음과 <form>같이 해당 버튼을 태그 안에 넣습니다 .
<form style="display: inline" action="http://example.com/" method="get">
<button>Visit Website</button>
</form>그러나 <button>태그가 CSS를 사용하여 스타일이 지정되고 시스템 위젯처럼 보이지 않는 경우 … 선호하는대로 <a>태그에 대한 새 클래스를 만들고 같은 방식으로 스타일을 지정하십시오.
답변
Bootstrap 3을 사용하는 경우 이것은 잘 작동합니다
<a href="#" class="btn btn-primary btn-lg active" role="button">Primary link</a>
<a href="#" class="btn btn-default btn-lg active" role="button">Link</a>답변
아니.
다음 솔루션은 JavaScript를 사용합니다.
<button type="button" onclick="location.href='http://www.stackoverflow.com'">ABC</button>버튼을와 <form>함께 기존 안에 배치 method="post"하려면 버튼에 속성이 있는지 확인하십시오. type="button"그렇지 않으면 버튼이 POST 작업을 제출합니다. 이런 식 <form>으로 GET과 POST 조작 버튼이 혼합 된 것을 가질 수 있습니다 .
답변
방금 동일한 문제로 뛰어 들었고 ‘button’태그를 ‘span’태그로 대체하여 해결했습니다. 제 경우에는 부트 스트랩을 사용하고 있습니다. 이것은 다음과 같습니다
<a href="#register">
<span class="btn btn-default btn-lg">
Subscribe
</span>
</a> 답변
그것이 유효하다면 정말 이상 할 것이고, 나는 그것이 유효하지 않을 것으로 기대합니다. 클릭 가능한 요소가 다른 클릭 가능한 요소 내에 있다는 것은 무엇을 의미합니까? 버튼 또는 링크 중 어느 것입니까?
답변
다른 옵션은 버튼의 onclick 속성을 사용하는 것입니다.
<button disabled="disabled" onClick="location.href='www.stackoverflow.com'" >ABC</button>그러나 이것은 작동하지만 사용자는 링크가 요소 내부에있는 것처럼 링크 위에 표시되지 않습니다.
답변
요즘 사양에서 허용하지 않더라도 <a href...><button ...></a>태그에 FWIW …