[javascript] 작업이없는 양식 및 enter가 페이지를 다시로드하지 않는 경우

제출 버튼이없는 HTML 양식을 만드는 가장 좋은 방법을 찾고 있습니다. 그 자체만으로도 충분하지만 제출과 같은 작업이 완료 될 때 (예 Enter: 텍스트 필드를 치는 등) 양식이 자체적으로 다시로드되지 않도록해야합니다 .



답변

onsubmit 핸들러를 양식에 추가하고 (일반 js 또는 jquery $ (). submit (fn)을 통해) 특정 조건이 충족되지 않으면 false를 반환합니다.

양식 제출을 원하지 않는 경우가 아니면 양식 요소에서 ‘action’속성을 생략하지 않는 이유는 무엇입니까?


답변

action="javascript:void(0);"페이지 다시로드를 방지하고 HTML 표준을 유지하기 위해 양식 에 포함 할 수 있습니다.


답변

이 이벤트를 텍스트 필드에 추가하기 만하면됩니다. Enter 키를 눌러 제출할 수 없으며 필요에 따라 제출 버튼을 추가하거나 form.submit ()을 호출 할 수 있습니다.

onKeyPress="if (event.which == 13) return false;"

예를 들면 :

<input id="txt" type="text" onKeyPress="if (event.which == 13) return false;"></input>


답변

양식에서 Enter 키를 누르면 양식의 자연스러운 동작이 제출되는 것입니다. 자연스럽지 않은 동작을 중지하려면 jquery를 사용하여 제출 (기본 동작)을 방지해야합니다.

$("#yourFormId").on("submit",function(event){event.preventDefault()})


답변

아이디어:

<form method="POST" action="javascript:void(0);" onSubmit="CheckPassword()">
    <input id="pwset" type="text" size="20" name='pwuser'><br><br>
    <button type="button" onclick="CheckPassword()">Next</button>
</form>

<script type="text/javascript">
    $("#pwset").focus();
    function CheckPassword()
    {
        inputtxt = $("#pwset").val();
        //and now your code
        $("#div1").load("next.php #div2");
        return false;
    }
</script>


답변

해결하는 두 가지 방법 :

  1. 폼의 액션 값은 “javascript : void (0);”입니다.
  2. 제출을 방지하기 위해 양식에 키 누르기 이벤트 리스너를 추가하십시오.


답변

첫 번째 응답은 최상의 솔루션입니다.

onsubmit 핸들러를 양식에 추가하고 (일반 js 또는 jquery $ (). submit (fn)을 통해) 특정 조건이 충족되지 않으면 false를 반환합니다.

jquery로 더 구체적입니다.

$('#your-form-id').submit(function(){return false;});

양식 제출을 원하지 않는 경우가 아니면 양식 요소에서 ‘action’속성을 생략하지 않는 이유는 무엇입니까?

Chrome 확장 프로그램 작성은 사용자 입력을위한 양식이 있지만 제출하고 싶지 않은 경우의 예입니다. action = “javascript : void (0);”를 사용하면 코드가 작동 할 수 있지만 인라인 Javascript 실행에 대한 오류가 발생하는 이 문제 가 발생합니다.

작업을 완전히 생략하면 양식이 다시로드되며 Chrome 확장 프로그램을 작성할 때 원하지 않는 경우도 있습니다. 또는 어떤 종류의 내장 계산기가있는 웹 페이지가있는 경우 사용자가 입력을 제공하고 “계산”또는 이와 유사한 것을 클릭합니다.