javascript - 태그 - 자바스크립트 form submit




양식을 제출하지 않고<button>을 만들 수 있습니까? (5)

그냥 좋은 오래된 HTML을 사용하십시오 :

<input type="button" value="Submit" />

원한다면 링크의 주제로 감싸십시오.

<a href="http://somewhere.com"><input type="button" value="Submit" /></a>

또는 자바 스크립트에서 다른 기능을 제공하기를 원한다면 다음과 같이하십시오.

<input type="button" value="Cancel" onclick="javascript: someFunctionThatCouldIncludeRedirect();"/>

2 개의 버튼이있는 양식이 있습니다.

<a href="index.html"><button>Cancel changes</button></a>

<button type="submit">Submit</button>

jQuery UI의 버튼도 사용합니다.

$('button').button();

그러나 첫 번째 단추는 양식을 제출합니다. 나는 type="submit" 이 없다면 그렇게하지 않을 것이라고 생각했을 것입니다.

분명히 나는 ​​이것을 할 수 있었다.

$('button[type!=submit]').click(function(event) { event.stopPropagation(); });

그러나 자바 스크립트를 사용하지 않고 양식을 제출하는 것을 막을 수있는 방법이 있습니까?

솔직히 말하면, 버튼 만 사용하여 jQuery UI로 스타일을 지정할 수 있습니다. 내가 링크 button() 에 전화를 시도하고 예상대로 작동하지 않았다 (꽤 못생긴 보았다!).


솔직히, 나는 다른 대답을 좋아한다. JS에 쉽게 접근 할 필요가 없습니다. 하지만 당신이 jQuery에 대해 물어 보았다. 그래서 완전성을 위해 jQuery에서 .click () 핸들러로 false를 반환하면 위젯의 기본 동작이 무효화됩니다.

예를 보시려면 여기를 참고하십시오 . 다음은 문서 입니다.

간단히 말해서, 샘플 코드로, 이렇게 :

<script type="text/javascript">
    $('button[type!=submit]').click(function(){
        // code to cancel changes
        return false;
    });
</script>

<a href="index.html"><button>Cancel changes</button></a>
<button type="submit">Submit</button>

추가 이점으로, 이것으로 앵커 태그를 없애고 버튼을 사용할 수 있습니다.



type 속성을 설정하지 않고도 OnClick 핸들러에서 false 를 반환하고 onclick 속성을 onclick="return onBtnClick(event)" 으로 선언 할 수 있습니다.


<form onsubmit="return false;">
   ...
</form>




button