2

標準形式のJSPページがあります。2つのボタンがあり、それぞれが押されたときに異なるアクションを実行し、フォームが送信されます-アクション1とアクション2。

私はもともとこれを1つのボタンに設定していたので、すべて次の方法で実行され、正常に機能しました。

$('#form').submit( function() { .... }

しかし、今は2つのボタンがあります。同じようにしたいのですが、どのボタンを押したかを確認する方法です。

.click関数を使用してこれを行うことはできますが、既存のform.submit機能を壊したくありません。

以下はこれのための私のコードです-これは機能しません:

    $('#form').submit( function() {

        // Set the field array variables with data
        $('button[name="action1"], [name="action2"]').each(function(index) {
            alert('index : ' + index );
            alert('value : ' + this.value);
        });

        $('button[name="action1"]').click(function(e) { 
            alert('ac1 clicked');
        }); 

        $('button[name="action2"]').click(function(e) { 
            alert('ac2 clicked');
        }); 

私のhtmlボタンは次のとおりです。

            <button id="submitButton" name="action1" value="action1" type="submit">action 1</button>
            <button id="submitButton" name="action2" value="action2" type="submit">action 2</button>

form.submit内でこれを行う方法、または.clickを実行してフォームを送信する方法はありますか?私はこれに関する解決策に少し迷っていますか?

助けてください :)

4

5 に答える 5

2

イベント オブジェクトの関連ターゲットを読み取ることができます。

$('#form').on('submit', function(evt) {
    if (evt.relatedTarget && $(relEl).is('input[type=submit]')) {
        /* related element is a button - do something */
    }
    evt.preventDefault(); //cancel form submit, as required
});
于 2012-08-03T11:53:28.383 に答える
0

ボタンのクリック ハンドラーで、フォームを送信する前に隠しフィールドを設定します。次に、リクエスト ハンドラの隠しフィールドの値を読み取って、どのアクションがリクエストされたかを調べます。

于 2012-08-03T11:50:24.197 に答える
0

ボタンにイベント ハンドラーをバインドする

$('button').on('click', function(e) {
    var buttonId = $(this).attr('name');
    if(buttonId = 'action1') {
        // action1 was pressed
    } else {
        // action2 was pressed
    }

    $('#form').trigger('submit'); // trigger submit of form.

    e.preventDefault();
});
于 2012-08-03T11:51:12.067 に答える
0

標準の HTML フォーム送信の場合:

HTML:

<form method="..." action="...">
    ...
    <input type="hidden" name="action">
    <input value="action1" type="submit" value="action 1" />
    <input value="action2" type="submit" value="action 2" />
    ...
</form>

Javascript:

$('button[type="submit"]').on('click', function() {
    $("#action").val(this.value);//where "#action" selects an input field (in the same form) of type="hidden"
});

AJAX 送信の場合は、同じことを行いますが、アクション フィールドの値を送信ハンドラーの JavaScript に読み込みます。

于 2012-08-03T11:55:26.797 に答える
0

まず、同じページに同じ ID を持つ 2 つの dom 要素を含めないでください。class 属性はそのようなものです。ボタンの ID をそれぞれ submitButton1 と submitButton2 に変更すると、これが機能するはずです。

$('#submitButton1').closest('#form').submit(function() {
    // first button action
});

$('#submitButton2').closest('#form').submit(function() {
    // second button action
});
于 2012-08-03T11:56:27.523 に答える