重要なお知らせ

「教えて! goo」は2025年9月17日(水)をもちまして、サービスを終了いたします。詳細はこちら＞

電子書籍の厳選無料作品が豊富！

マジレス希望

jQuery3 reset()が効かない。

解決済

  • 質問者：PlanetSD
  • 質問日時：
  • 回答数：3件

jQueryでボタンを押したら、フォームのなかに入っているテキストをリセットしたいのですが、これまで、$()[0].reset();のように書いていましたが、jQuery3.2.1を使っているのも原因なのでしょうか?



<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>TEST</title>
<script src="js/jquery-3.2.1.min.js"></script>
</head>
<body>

<script type="text/javascript">
$(function(){
$('#post').click(function(){
alert('test');
$('#title')[0].reset();
$('#content')[0].reset();
});
});
</script>

<div>
タイトル: <input id="title"><br>
本文: <textarea id="content" rows="3"></textarea><br>
<button id="post">投稿</button>
</div>

</body>
</html>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (3件)

No.3ベストアンサー

  • 回答者： yambejp
  • 回答日時：

たとえば、ロード時にdata-として取っておいて


リセットボタンをおすとその値に上書きするとか

<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.2. …
<script>
$(function(){
$('input,textarea').each(function(){$(this).data('default',$(this).val())});
$('[type=button][value=reset]').on('click',function(){
$('#title,#content').val(function(){return $(this).data('default');});
});
});
</script>


<div>
タイトル: <input id="title" value="hoge"><br>
本文: <textarea id="content" rows="3"></textarea><br>
<button type="button" id="post">投稿</button>
<input type="button" value="reset">
</div>
    • good
    • 0
    • 件
通報する
この回答へのお礼

ありがとうござまいす。.data()で初期のデータを保持して、リセットボタンで、戻しているのですね。書き方がとても参考になります。$('#title,#content')のように、2つでも指定できるのですね。知りませんでした。

通報する
お礼日時：2017/06/27 16:58

参考程度に

No.2

  • 回答者： fujillin
  • 回答日時：

こんにちは



reset()はリセットボタンとほぼ同じ働きをするメソッドで、formエレメントに対してのメソッドのはずです。（個々の要素に対してのメソッドではない）
https://developer.mozilla.org/ja/docs/Web/API/HT …

＞jQuery3.2.1を使っているのも原因なのでしょうか?
インデックスで取得した時点で、通常のDOM要素（jQueryオブジェクトではなく）を得ていますのでjQueryは関係なくなっているはずです。

reset()で処理したいのであれば、form要素を設定するか、あるいは個々の要素をクリアしたいだけなら直接クリアすればよろしいのでは。
例えば、
　$('#title').val("");
　$('#content').val("");

＞これまで、$()[0].reset();のように書いていましたが～～
ブラウザ依存で動作するものがあるのかも知れませんが、普通は動作しないのではないでしょうか？
    • good
    • 1
    • 件
通報する
この回答へのお礼

ありがとうございます。理解できました。
過去に、reset()でリセットした記憶と、jQueryでできることの処理とが混同していました。

通報する
お礼日時：2017/06/27 13:36

No.1

  • 回答者： yambejp
  • 回答日時：

そもそもinputやtextareaにresetなんてイベントはないのでは？

    • good
    • 1
    • 件
通報する
この回答へのお礼

ありがとうございます。勘違いしていました。どおりで、調べてもでてこないはずです。

通報する
お礼日時：2017/06/27 13:31

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

関連するカテゴリからQ&Aを探す

今、見られている記事はコレ!

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報