1

奇妙なことに遭遇します。私は次のフォームを持っています:

<form id="addExpenseForm" name="addExpenseForm" data-bind="submit: addExpense">
    <input type="submit" value="Add" class="save" id="submit" name="submit" />
    <input type="reset" value="Reset" class="reset" id="reset" name="reset" />
</form>

ご覧のとおり、reset内部にすべてをクリアするためのボタンがありますform


私はのとそれをこのようにバインドするために使用しKnockout.jssubmitいます...formreset

self.addExpense = function (formElement) {
  $('#addExpenseForm')[0].reset();
};

すべて問題ないようですが、次のエラーが発生します。

Uncaught TypeError: Property 'reset' of object #<HTMLFormElement> is not a function 

私のコードは正しく、奇妙な部分は、resetボタンを削除してもコードが正常に機能するため、なぜこれが発生するのかわかりません。

どうすればこれを解決できますか? reset()メソッドとresetボタンを同時に使用すると、ある種の競合が発生しますか?

念のため、ボタンjsfiddleの削除をテストし、ここで求めていることを確認するためにこれを作成しました。reset

http://jsfiddle.net/oscarj24/vWNf7/

4

3 に答える 3

5

はい、ここに大きな違いがあります。jQuery を使用する場合、jQuery スタイリング (exp. $("addExpenseForm")) を介して呼び出される DOM 要素には「プロパティ」が与えられます。これらのプロパティがどのように書き込まれ、追加されるかは、要素とその用途 (およびその他のものはあちこちにありますが、それは別のレッスンです) によって異なります。

リセットボタンなしで from を作成すると、「プロパティ」リセットは確かに機能です! クエリを実行すると、次の値が返されます: function reset() { [native code] }.

ただし、ボタンを手動で追加すると (つまり、HTML に配置すると)、リセットはそのボタンになり、関数ではなくなります。つまり、 のようなものが返されます<input type="reset" value="Reset" class="reset" id="reset" name="reset" />

ここにあなたの問題があります...

BUTTON が HTML 経由で追加されている場合は、次を使用します。

$('#addExpenseForm')[0].reset.click();

それ以外の場合、ボタンは ではなくtype="reset"、単に「リセット」と表示されているボタンであるか、ボタンがまったくないだけです。使用する:

$('#addExpenseForm')[0].reset();

また

すべてを 1 つの大きな if ステートメントにまとめてください。

if (typeof $('#addExpenseForm')[0].reset == "function") {
    $('#addExpenseForm')[0].reset();
}
else {
    $('#addExpenseForm')[0].reset.click();
}

そして、にやにや笑うために、ここにその IF ステートメントを 1 行で示します。

typeof $("#addExpenseForm")[0].reset == "function" ? $("#addExpenseForm")[0].reset() : $("#addExpenseForm")[0].reset.click();
于 2013-04-24T20:46:34.623 に答える
0

リセット ボタンの ID 属性を「reset」から別のものに変更します。

エラーが発生する理由については、https ://stackoverflow.com/a/12541054/492325 を参照してください。

于 2013-04-24T20:44:54.950 に答える