0

次の動作しない HTML ドキュメントを検討してください。

<html> 
    <body>
        <form action="" method="GET" onsubmit="return f(this);">
            <input type="text" name="bar" value="" />
            <input type="button" name="foo" value="foo" />
        </form>
    </body>
    <script type="text/javascript">
        function f(x) {
            alert(x.bar);
        }
    </script>
</html>

私が達成しようとしているのは、(a) foo ボタンが押されたときです。または (b) テキスト入力にフォーカスがあるときに Enter キーが押された。次に、関数 f が s テキスト入力の内容で呼び出されます。それ以外の場合、ブラウザは f が戻った後も同じページにとどまります。

どうすればこれを達成できますか？

4

2 に答える 2

3

ボタン入力ではなく送信入力を使用する必要があります。テキスト入力からテキストを取得するには、value プロパティを使用して false を返し、フォームが送信されないようにします。

<html>
    <body>
        <form action="" method="GET" onsubmit="return f(this);">
            <input type="text" name="bar" value="" />
            <input type="submit" name="foo" value="foo"/>
        </form>
        <script type="text/javascript">
                function f(x)
                {
                    alert(x.bar.value);
                    return false;
                }
        </script>
        </body>
</html>

フィドル

于 2012-07-08T20:19:06.640 に答える
0

フォーム要素の代わりに値で呼び出すだけですか?

onsubmit="return f(this.bar.value);"

そのページの送信を防ぐには、falseから戻ることができますf。

しかし、その onsubmit-attribute の代わりに適切なイベント ハンドラーを使用する方がはるかにクリーンです。詳細については、こちらをご覧ください。

<html>
    <body>
        <form id="inputform" action="" method="GET">
            <input type="text" name="bar" value="" />
            <input type="button" name="foo" value="foo"/>
        </form>
        <script type="text/javascript">
        function f(x) {
            alert(x.bar);
        }
        var form = document.getElementById("inputform");
        form.onsubmit = function(event) {
            var x = f(form.bar.value);
            if (!x)
                event.preventDefault();
        };
        </script>
    </body>
</html>
于 2012-07-08T20:13:38.887 に答える