일반 링크를 사용하여 양식을 제출하십시오.

양식을 제출하고 싶습니다. 그러나 나는 형식을 제출와 입력 버튼을 사용하는 기본적인 방법이지만 않을거야 링크를.

아래 이미지는 이유를 보여줍니다. 양식을 저장 / 제출하기 위해 이미지 링크를 사용하고 있습니다. 이미지 링크에 대한 표준 CSS 마크 업이 있기 때문에 입력 제출 버튼을 사용하고 싶지 않습니다.

onClick = "document.formName.submit ()" 을 요소 에 적용하려고했지만 html 메소드를 선호합니다.

어떤 아이디어?

두 가지 방법. 버튼을 만들고 스타일을 지정하여 CSS가있는 링크처럼 보이게하거나 링크를 만들고을 사용하십시오 onclick="this.closest('form').submit();return false;".

내가 아는 한, 어떤 형태의 스크립팅 없이는 실제로 이것을 할 수 없습니다.

<form id="my_form">
<!-- Your Form -->    
<a href="javascript:{}" onclick="document.getElementById('my_form').submit(); return false;">submit</a>
</form>

여기 에서 예 .

input type="submit"이와 같은 스타일링은 저에게 효과적이었습니다.

.link-button { 
     background: none;
     border: none;
     color: #0066ff;
     text-decoration: underline;
     cursor: pointer; 
}

<input type="submit" class="link-button" />

Chrome, IE 7-9, Firefox에서 테스트

제출할 이미지를 사용하고 있습니다. type="image"입력 "버튼"을 사용하면됩니다 .

<input type="image" src="yourimage.png" name="yourinputname" value="yourinputvalue" />

사용하다:

<input type="image" src=".."/>

또는:

<button type="send"><img src=".."/> + any html code</button>

일부 CSS

확실히, 링크 ( a) 태그가 있는 양식을 제출하는 순수한 HTML 솔루션은 없습니다 . 표준 HTML은 버튼이나 이미지 만 허용합니다. 다른 공동 작업자가 말했듯이 버튼을 사용하여 링크 모양을 시뮬레이트 할 수는 있지만 질문의 목적이 아닌 것 같습니다.

IMHO, 나는 제안되고 수용 된 해결책이 효과가 없다고 생각합니다.

양식에서 테스트했지만 브라우저가 양식에 대한 참조를 찾지 못했습니다.

따라서 this클릭해야하는 요소 (형식의 하위 노드)를 참조하는 객체를 사용하여 제출해야하는 한 줄의 JavaScript를 사용하여 이를 해결할 수 있습니다. this.parentNode폼 노드도 마찬가지 입니다. submit()그 형식으로 메소드를 호출 한 후 . 올바른 양식을 찾기 위해 전체 문서를 조사 할 필요는 없습니다.

<form action="http://www.greatsolutions.com.br/indexint.htm"                   
   method="get">
    <h3> Enter your name</h3>
    First Name <input type="text"  name="fname"  size="30"><br>
    Last Name <input type="text" name="lname" size="30"><br>
    <a href="#" onclick="this.parentNode.submit();"> Submit here</a>
</form>

내 이름으로 입력한다고 가정 해보십시오.

get제출 후로드 된 페이지의 URL에서 올바른 매개 변수를 볼 수 있기 때문에 양식 메소드 속성에 사용 했습니다.

http://www.greatsolutions.com.br/indexint.htm?fname=Paulo&lname=Buchsbaum

이 솔루션은 onclick이벤트 또는 유사한 이벤트 를 허용하는 모든 태그에 적용됩니다 .

this직접 사용하거나 함수의 인수로 전달할 수있는 event변수 (모든 주요 브라우저 및 IE9 이상에서 사용 가능) 와 함께 컨텍스트를 복구하는 데 탁월한 선택 입니다.

이 경우 이벤트를 시작한 요소를 나타내는 a특성을 사용하여 아래 행으로 태그를 사용하여 행을 대체하십시오 target.

<a href="#" onclick="event.target.parentNode.submit();"> Submit here</a>

OnClick = "document.getElementById ( 'formID_NOT_NAME'). SUBMIT ()"를 사용할 수 있습니다.