18

jQuery でいくつかのフォームをリセットしようとしていますが、問題が発生しています。関数やカスタム プラグインの作成を伴うソリューションは別として、reset メソッドは jQuery の標準部分ではなく、標準の Javascript の一部であることに何度も気付きます。

とにかく、私の最初のアプローチは

$("#theForm").reset();

フォームの id="theForm" です。

reset() が jQuery の一部であると想定していたため、これは明らかに機能しませんでした。

次に試したのは、

document.getElementById(theForm).reset();

どちらもうまくいきませんでした。私は jQuery を初めて使用するので、通常の Javascript と jQuery を混在させることができるかどうかわかりません。こんなことを言うなんて、私はばかみたいに聞こえるにちがいない。

とにかく、さらに調査を行った後、これらを実行することで jQuery で reset() を使用できることが何度もわかりました...

$("#theForm")[0].reset();

また

$("#theForm").get(0).reset();

これら 2 つのスニペットを含むすべての記事で、コメントの全員が機能していました。

私を除いて。

エラーコンソールは、私が書いたものが存在しないことを私に伝え続けます。私はすべてのコードをチェックしましたが、「リセット」という単語のインスタンスは他にないため、それもあり得ません。

とにかく、私は困惑しています。

4

9 に答える 9

43

このスレッドの元の問題の解決策

次のような HTML フォームの場合:

<form id="theForm">
</form>

を使用してdocument.getElementById("theForm").reset()いるときに、次のような js エラーが発生した場合

reset() は関数ではありません

resetその理由は、 asnameまたはを持つ要素である可能性がありますid。私は同じ問題に直面しました。
任意の要素に名前を付けると、resetreset() 関数がオーバーライドされます。

于 2014-03-26T04:40:43.730 に答える
18

これ：

$("#theForm")[0].reset();

うまく動作します。ここで見てください：http://jsfiddle.net/tZ99a/1/

したがって、フォームまたはスクリプトをボタンにアタッチする方法に問題があるはずです。

于 2013-05-27T20:59:31.753 に答える
6

このエラーは、リセット ボタン (またはその他のフォーム要素) に reset -- という名前を付けると発生しますname="reset"。したがって、reset メソッドではなくform.reset、DOM 要素に解決されます。name="reset"

デモname="reset"- コンソールを確認

$(function() {
    $('.reset1').on('click', function() {
        this.form.reset();
    });
  
    $('.reset2').on('click', function() {
        $('form')[0].reset();
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form>
  <input type="text" name="somename"/><br/>
  <input type="button" name="reset" class="reset1" value="Reset - form.reset()"/><br>
  <input type="button" name="reset" class="reset2" value="Reset - $('form')[0].reset()"/>
</form>

同じデモname!="reset"ですが、エラーはありません。コードの動作

$(function() {
    $('.reset1').on('click', function() {
        this.form.reset();
    });
  
    $('.reset2').on('click', function() {
        $('form')[0].reset();
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form>
  <input type="text" name="somename"/><br/>
  <input type="button" name="someothername" class="reset1" value="Reset - form.reset()"/><br>
  <input type="button" name="someothername" class="reset2" value="Reset - $('form')[0].reset()"/>
</form>

同じデモですが、id="reset"コンソールを確認してください

$(function() {
    $('.reset1').on('click', function() {
        this.form.reset();
    });
  
    $('.reset2').on('click', function() {
        $('form')[0].reset();
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form>
  <input type="text" name="somename"/><br/>
  <input type="button" id="reset" class="reset1" value="Reset - form.reset()"/><br>
  <input type="button" id="reset" class="reset2" value="Reset - $('form')[0].reset()"/>
</form>

于 2015-06-17T01:13:10.203 に答える
2

が ID の場合"theForm"、使用する必要があります$('#theForm')[0]か? 間違った習慣だと思います。HTML ページに複数のフォームがある場合は、名前を使用します。また、ID を使用する場合は一意である必要があります。

ここに HTML コードを提供していただければ幸いです :)

于 2013-10-08T19:04:17.107 に答える
0

この問題は、フォームのリセット ボタン ID が「リセット」に設定されている可能性が高いため、エラー メッセージが表示されます。

私は同じ問題を抱えていましたが、最終的に理解し、フォームを次のように変更しました。

    フォーム アクション="bla" メソッド="投稿" id="myform">
    ...
    
    /フォーム>

リセットボタンIDを変更するとうまくいきました。

于 2015-01-21T23:50:45.267 に答える
0

だから...ここでいくつかのことが起こっていると思います。

  1. ディエゴが彼の答えで指摘したように、$('#theForm')[0].reset();非常にうまく機能します。
  2. あなたが試した 2 番目の例: document.getElementById(theForm).reset();JavaScript が "theForm" という変数を使用していると見なすため、機能しません。その場合、変数の値はフォームの ID を表す文字列でなければなりません。 ... のようなものvar theForm = 'theForm';は、非常に混乱する可能性があります。あなたがしようとしていたのは次のようなものだったと思います: document.getElementById('theForm').reset();-- これは問題なく動作し、基本的には #1 のコードと同じです。
  3. これらの例はすべて、HTML が次のようなものであることを前提としています。 <form id="theForm"> ... </form>-- ID "theForm" は、フォーム内の入力タグではなく、フォーム タグにある必要があります。

これらの動作を示すフィドルを作成しました: http://jsfiddle.net/boliver/ZDQxE/

于 2013-10-04T03:24:44.870 に答える