1

私は自分のホームページでユーザーのメールアドレスを収集する基本的なフォームを使用しています。[送信] ボタンはありませんが、モーダル ボックスを起動するアンカー リンクがあります。(ユーザーが入力したメールアドレスはモーダルコンテンツで使用されます)

ユーザーがフォームの電子メール入力に入力するとき、彼らの自然な本能は、Enter キーを押すか、「送信」リンクをクリックすることです。送信リンクは、モーダルを起動することでうまく機能しますが、Enter キーを押すと、フォームの送信が試行されます。ユーザーにフォームを送信してほしくないのですが、アンカーリンクを押してモーダルを起動してください。

次の方法はありますか?

A) フォームを送信するのではなく、モーダルを起動するように入力のデフォルトの動作を変更しますか?

また

B) Enter ボタンがフォームを送信できないようにし、ユーザーにアンカー リンクをクリックするように強制しますか?

以下の非常に単純な構文のleanmodalを使用しています。

<a href="#newsForm" rel="leanModal" class="submitModal">Submit</a>

<div id="#newsForm">Modal content here</div>

注：モーダルは入力と互換性がないため、送信入力を「モーダルランチャー」として使用できません。

4

2 に答える 2

1

むしろこういうのをオススメします。

$(function() {
    $('#newsForm').submit(function( jqEvt ) {
        jqEvt.preventDefault();
        $('.submitModal').click();
    });
});
于 2012-08-08T16:08:54.620 に答える
0

A) enter のデフォルトの動作を変更して、フォームを送信するのではなく、モーダルを起動します。

$(function(){
    $(document).on('keyup', function(e) {
        var code = (e.keyCode ? e.keyCode : e.which);
        if(code == 13) { //Enter keycode
            //If user press enter will open the modal
            $('.submitModal').click();
        }
    });
});​

B) Enter ボタンによるフォームの送信を無効にし、ユーザーにアンカー リンクをクリックするように強制します。

$(function(){
    $(document).on('keyup', function(e) {
        var code = (e.keyCode ? e.keyCode : e.which);
        if(code == 13) { //Enter keycode
            //Stop the "submit", nothing will happen when user press enter
            e.preventDefault();
        }
    });
});​

C) 別の方法: 次submit();のようにして関数を「オーバーライド」できます。

$(function() {
    $('#newsForm').submit(function(e) {
        $('.submitModal').click();
        e.preventDefault();
    });
});
于 2012-08-08T16:05:22.737 に答える