16

現在非公開のページに問題が発生しているため、実際のコードを提供できなかったことをあらかじめお詫び申し上げます：-/ご容赦ください。

HTMLフォームがあります。（独自の）カレンダーウィジェットをテキスト入力フィールドの1つに添付しました。ユーザーがフィールドにタブで移動すると、カレンダーが表示されます。カレンダーにはいくつかのボタンがあります（前月/翌月に移動するため）。ユーザーがこれらのボタンの1つをクリックすると、それに応じてカレンダーが更新されますが、フォームも送信されます。カレンダーコードには、カレンダー自体とそれに添付されているテキスト入力フィールド以外には何も触れていません。フォームを送信することは言うまでもありません。次の質問のいずれかに関する手がかりをいただければ幸いです。

1）そのような設定でフォームを送信できた可能性はありますか？

2）送信ボタンをクリックするか、Enterキーを押す以外に、一般的にフォームを送信するものは何ですか？（特に、通常のボタンはフォームを送信しますか？どのような状況で？）

3）これを理解できない場合の回避策として、フォームの送信を完全に無効にする（そして送信キーに添付されたイベントハンドラーで再度有効にする）方法はありますか？

注：カレンダーはそれ以外は正常に動作します-主要なイベントに正常に応答し、日付自体（ボタンではありません）のイベントをクリックします。FirefoxとChromeの両方でこれを試しましたが、同じ動作をしました。クリックイベントハンドラーをFireBugで段階的に追跡しようとしましたが、すべてが完全に正常に見えましたが、フォームが終了した瞬間にフォームが送信されました（そしてページがリロードされました）。ウィジェットはjQuery1.7.2を使用します。これを理解および/または解決するための助けは最もありがたいです！

4

5 に答える 5

30

私自身の質問に答えて申し訳ありませんが、私がそれらとコメントから学んだにもかかわらず、与えられた答えのどれも完全ではありませんでした！参加してくださった皆様、ありがとうございました！

それで：

1 + 2）<button>要素によって定義されたボタンは、送信を引き起こします（type="submit"設定されているかのように。少なくとも一部のブラウザーでは）。送信を引き起こさないボタンが必要な場合は、、<button type="button">または古き良きを使用する必要があります<input type="button" />。

3）（今は不要ですが、質問の一部でした。）フォームの送信を防ぐ方法はたくさんあります。それらの3つは次のとおりです。

  • イベントを処理し、フラグが設定されていない場合onsubmitに送信を防止します（byreturn false;または-できれば！-by ）。e.preventDefault();実際にフォームを送信する必要があるイベントを処理するときにフラグを設定します

  • イベントを処理し、onsubmitイベントをトリガーした要素が送信を発生させたい要素（の1つ）ではない場合に上記のように送信を防ぐため

  • フォームアクションを非アクションに設定します。つまりaction="#"、実際にフォームを送信する必要があるイベントのハンドラーに、アクションを適切なアドレスに設定させます。

于 2012-08-10T02:08:52.040 に答える
1

カレンダーコードはsubmit()どこかを呼び出していませんか？

3）これを理解できない場合の回避策として、フォームの送信を完全に無効にする（そして送信キーに添付されたイベントハンドラーで再度有効にする）方法はありますか？

残念ながら、フォームイベントclickの前にハンドラーが呼び出されることが信頼できるかどうかは完全にはわかりません。submit

( function () {

  var prevent_submit = true;

  $( "form" ).on( 'submit', function ( event ) {

    if ( prevent_submit ) {

      event.preventDefault();

    }

  } );


  $( "input[type='submit']" ).on( 'click', function ( event ) {

    prevent_submit = false;

  } );

} )();

また

$( "form" ).attr( { action : "#", method : "post" } );

$( "input[type='submit']" ).on( 'click', function ( event ) {

  event.target.form.action = "...";

} );
于 2012-08-09T23:52:47.783 に答える
1

カレンダーは、jQueryまたはプレーンJavaScriptを使用してフォームのsubmit（）メソッドを呼び出すことにより、JavaScriptソースコードでフォームを送信できます。

フォームの送信を無効にし、ボタンを押した場合にのみ許可する方法の例を次に示します。

<form id="form">
    <input type="text" />
    <input type="button" name="submit-button" value="Submit"/>
</form>​
<script type="text/javascript">
    var form = document.getElementById('form'),
        button = form['submit-button'];
    form.onsubmit = function(e) {
        return !!form.getAttribute('data-allow-submit');
    };
    button.onclick = function() {
        form.setAttribute('data-allow-submit', 1);
        form.submit();
    };
</script>

デモ

于 2012-08-10T00:05:29.480 に答える
0

テキストフィールドでEnterキーを押すと、フォームの送信がトリガーされる場合があります。こちらをご覧ください。特にそれがフォームの唯一の要素である場合。ポストバックを制御する1つの方法は、アクションを空に設定し、Javascriptを使用して自分でイベントを発生させることです。

于 2012-08-09T23:53:21.843 に答える
0

終了フォームタグの配置を確認してください。私は一度この問題を抱えていましたが、フォーム自体に「許可」コードがあり、送信するための適切なアクセス許可レベルがなかったために、ユーザーが終了タグに到達できなかったことがようやくわかりました。事実上、これは開いたフォームタグを残し、同じページの他の場所にある他のボタンに応答しました。

于 2019-05-19T22:45:17.520 に答える