사용자가 Enter 키를 눌러 양식을 제출하지 못하도록합니다.

"Enter"키를 눌러 연락처 양식을 제출하는 사용자를 어떻게 막을 수 있습니까? 이 양식은 FormMaster 모듈을 사용하여 만듭니다. 다음과 같이 입력 필드에 대한 코드는 다음과 같습니다사용자가 Enter 키를 눌러 양식을 제출하지 못하도록합니다.

<div id="dnn_ctr1410_FormMaster_ctl_9d6e1fc4341b453f905425dacbefddf2div"> 
    <label class="SubHead" id="dnn_ctr1410_FormMaster_lbl_ctl_9d6e1fc4341b453f905425dacbefddf2" for="dnn_ctr1410_FormMaster_ctl_9d6e1fc4341b453f905425dacbefddf2">Message*<br></label> 
    <textarea class="wsi_contactform_bottomcell" tabindex="1" id="dnn_ctr1410_FormMaster_ctl_9d6e1fc4341b453f905425dacbefddf2" wrap="off" cols="20" rows="2" name="dnn$ctr1410$FormMaster$ctl_9d6e1fc4341b453f905425dacbefddf2"></textarea> 
    <span style="display:none;" class="NormalRed" id="dnn_ctr1410_FormMaster_rfv_313f9f05e5224c4e9bbf2bf6808f43c9"><br>Enter your message.</span> 
</div>

나는 다음과 같은 스크립트를 사용하지만, 어떤 결과없이 :

$('.wsi_contactform_bottomcell').on('keypress keydown keyup', function (e) { 
    if (e.keyCode == 13) { 
     e.preventDefault(); 
    } 
});

그리고 입력에 의해 나는 키보드의 "Enter"키를 의미한다! 일부 브라우저는 keyCode를 사용하고 다른 사람이 which를 사용 e.which

출처

2013-10-18 BlueBay

'keydown' 만 남기기 – Spokey

이벤트 콜백 내에 중단 점을 넣습니다. 트리거되지 않으면 콜백을 잘못된 요소에 바인딩합니다. 트리거되면 "e"변수를보고 그 내용을 봅니다. 어쨌든 keyCode가 맞아야합니다. – marquez

사용. 그러나 jQuery을 사용하면 정규화되므로 생각할 필요가 없습니다. 원하는 것을 선택할 수 있습니다. 단지 키 누름을 무시하고 제출 버튼을 제거하지 왜

if (e.which == 13) { 
     e.preventDefault(); 
    }

참조

event.which는 demo

출처

2013-10-18 13:32:43

방금 시도했지만 올바른 결과가없는 경우 :/ – BlueBay

jquery와 코드 문서 준비 완료 –

예를 들어 주셔서 감사합니다. 코드 + 문서 준비가 포함되어 있지만 작동하지 않습니다. – BlueBay

를 참조하십시오. 그 대신에 this.submit() 버튼을 추가하십시오. 좋아요 :

<input type="button" value="Submit contactform" onclick="this.submit();">

이렇게하면 양식에서 "Enter 키"기능이 제거됩니다.

출처

2013-10-18 13:34:58

이 코드 행은 모듈에 의해 동적으로 만들어지기 때문에 실제로는 불가능합니다. – BlueBay

나는 이것을 과거에 해왔고 그것은 나에게 잘 맞았다.

<input type="text" name="foo" onKeyPress="return disableEnterKey(event)" >

: 특정 입력 필드에 대한 양식 제출을하지 않으려면

<script language="JavaScript"> 

function disableEnterKey(e) 
{ 
    var key;  
    if(window.event) 
      key = window.event.keyCode; 
    else 
      key = e.which; 

    return (key != 13); 
} 
</script> 

<body onKeyPress="return disableEnterKey(event)">

, 입력 필드의 때 onKeyPress 핸들러에서이를 호출하여 전체 페이지에 대한 키를 입력하여이 영향을 사용할 수 없게됩니다

특별히 당신을 위해 편집

$('.wsi_contactform_bottomcell').on('keypress', disableEnterKey);

스크립트가 호출되지 않으면 핸들러를 너무 일찍 바인딩하려고 할 수 있습니다. 모듈이 textarea를 추가하지 않은 경우 selector가 0 결과를 반환하면 jQuery가 자동으로 실패합니다. 이 경우 이벤트 처리기를 바인딩하기 전에 모듈이 DOM에 대한 업데이트를 완료하는시기를 결정하기위한 전략을 제시해야합니다.

출처

2013-10-18 13:54:30

"입력 유형"을 사용할 수 없습니다. 모듈이 코드를 어떻게 구성하는지보십시오 – BlueBay

죄송합니다. 단지 그 예일뿐입니다. 특정 사례에 맞게 업데이트되었습니다. –

요소가 동적으로 만들어지면 요소가 존재하지 않으므로 코드가 작동하지 않습니다.

출처

2013-10-18 14:00:54 marquez

이 또한 작동하지 않습니다, 양식은 스크립트를 완전히 무시합니다. – BlueBay

사용자가 Enter 키를 눌러 양식을 제출하지 못하도록합니다.

답변

관련 문제