5

jQueryダイアログを使用してページにデータを入力しようとしています。わかりませんが、ユーザーがEnterキーを押すと、ページ全体が更新されます。テキストボックスの内容も検証されません。

問題を示すjsfiddleを作成しました。ここでドキュメントを確認しました。コードはガイドラインに従っているようですが、何かが足りないはずです。

これが私がダイアログを呼び出す方法です

$("#create-subtitle")
    .click(function () {
    $("#dialog-form-subtitles").dialog("open");
    return false;
});

これが私のダイアログの1つです：

$("#dialog-form-steptitles").dialog({
        autoOpen: false,
        height: 220,
        width: 450,
        modal: true,
        buttons: {
            "Ajouter un sous-titre pour les étapes": function () {
                var bValid = true;
                allFieldsStepTitle.removeClass("ui-state-error");
                bValid = bValid && checkLength(nameStepTitle, "sous-titre pour les étapes", 3, 50);

                if (bValid) {
                    var $parent = $("#StepTitles");
                    var numElem = $parent.find("tr").length;
                    $('#StepTitles > tbody:last').append('<tr><td><input class="text-box single-line" id="StepTitles_' + numElem + '__Name" name="StepTitles[' + numElem + '].Name" type="text" value="' + nameStepTitle.val() + '" /></td><td>&nbsp;<ul id="ListStep' + numElem + '"></ul></td><td><button id="create-step' + numElem + '" name="create-step' + numElem + '" class="btn btn-success">Ajouter une étape</button></td></tr>');
                    $(this).dialog("close");
                }
            },
            Cancel: function () {
                $(this).dialog("close");
            }
        },
        close: function () {
            allFieldsStepTitle.val("").removeClass("ui-state-error");
        }
    });

誰でもこれを手伝ってくれますか？

4

2 に答える 2

5

>enter内でヒットすると、フォームが送信され、ページが更新されます。できることはいくつかありますが、ほとんどの場合、フォームでの既定の送信アクションを防止する必要があります。コードはほとんどがフランス語なので、ナビゲートするのに苦労しましたが、更新を進めるには、次のようにします。forminput

$('form').on('submit', function(event){
    event.preventDefault();
});

そこから、Enter キーを使って何かをしたいと思うでしょう — ボタンのクリックをトリガーします — 繰り返しますが、テキストはフランス語なので、何を言っているのかわかりません。

$('your-input').keypress(function(event) {
    if(event.which == 13) { // 13 is the 'Enter' key
     // do something here
   }
});

それが役立つことを願っています。

于 2013-03-18T23:33:11.863 に答える
2

formjQuery のドキュメント ページでは、例にタグがありません。これが期待どおりに機能する理由です。ここでフォームなしでコードを確認してください。タグが必要な場合は、このSO の質問を確認してください。

于 2013-03-27T18:48:01.693 に答える