質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.51%

  • Java

    14050questions

    Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

jspでsubmitボタンを押した後に、背景色を変えたい

解決済

回答 2

投稿

  • 評価
  • クリップ 0
  • VIEW 409

prog1717nm

score 46

 <td>
 <input type="submit"value="OK" onClick="return confirm('これで大丈夫ですか')">
</td>


jspで、「OK」ボタンを押すと、「これで大丈夫ですか」という確認アラートが表示されるという処理をかきました。これに加えて、「OK」ボタンを押した後、jspページの背景の色が変わるようにしたいのですが、どのようにかいたら良いか分からないので教えてほしいです。宜しくお願いします。

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • Kosuke_Shibuya

    2018/06/20 16:30

    この質問でタグがJavaというのは不適切です。JavaScript に変更してください。もしかして JavaScript = jsp だと思ってます?

    キャンセル

  • mts10806

    2018/06/20 16:49

    JavaとJavaScriptの「別物感」を印象づけるフレーズ集 https://qiita.com/suin/items/1e4791ac4fca4885eb73

    キャンセル

  • mts10806

    2018/06/20 16:50

    ちなみに、submitボタンだと送信してしまうので、送信せずに何かしら処理をしたい場合、event.preventDefault()などで止める必要があるのは認識済みでしょうか。

    キャンセル

回答 2

+1

JavaScriptの関数を作ってそれをOKボタンで呼び出すようにしたほうがよいですね。
こんな感じ。

<html><head><title>テスト</title>
<script language="javascript" type="text/javascript">
  //OKボタンを押したときに呼び出される関数
  function OnButtonClick() {
    if ( confirm('これで大丈夫ですか') ) {
        //↓↓背景を変える処理↓↓
        document.getElementById('test').style.backgroundColor = "#FFFFAA";
        form.submit();
    }
  }
</script>
</head><body id="test">

<h2>テスト</h2>
<form action="" method="POST">
<input type="button"value="OK" onClick="OnButtonClick();">
</form>
</body></html>

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/06/20 17:32

    submit()してしまってはせっかく変えた背景意味ないのでは・・・。

    キャンセル

  • 2018/06/20 17:35

    というのは元々の要件がおかしかったせいですよね。失礼しました。

    キャンセル

  • 2018/06/20 17:55

    情報整備その他を考えるといろいろと難しいところがありますよね...
    自分はまず質問者が問題を解決出来るヒントを提供できれば良いと考えています。

    キャンセル

  • 2018/06/20 17:56

    そうですね。たまに実現したいことと文章が合ってないこともあるので、ちょっと慎重になってしまいます。

    キャンセル

  • 2018/06/20 18:02

    お二方、回答ありがとうございます。
    tsunexさん、JavaScriptのプログラムありがとうございます。早速実行してみたのですが、OKボタンを押した後すぐに、背景の色を変えるにはどうしたらよいでしょうか?確認アラートのOKボタンを押す前に、背景の色を変えたいのですが...。

    キャンセル

  • 2018/06/20 18:08

    ついでなので突っ込んでしまいますが、要件と質問でタイミングが矛盾しています。
    ・OKボタンを*押した後*すぐに、背景の色を変えるにはどうしたらよいでしょうか?
    ・確認アラートのOKボタンを*押す前*に、背景の色を変えたい

    整理した上で質問本文に反映していただけますか?

    キャンセル

  • 2018/06/20 18:26

    prog1717nmさん
    回答にコメントを入れました。
    背景の色を変える処理の1行を確認アラートのOKボタンを表示する前の箇所に移動すればよいと思います。
    質問はmts10806さんがおっしゃるとおり反映したほうが良いかもですね。

    キャンセル

checkベストアンサー

0

サンプル

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            table {
                table-layout: auto;
                border-collapse: collapse;
            }
            th, td {
                border: 1px solid #CCC;
            }
            tr.active {
                background-color: #CCF;
            }
            tr.deleted {
                background-color: #FCC;
            }
        </style>
    </head>
    <body>
        <div>
            <form action="">

                <table id="table-list">
                    <thead>
                        <tr>
                            <th>head</th>
                            <th>head</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>1</td>
                            <td>
                                <input class="delBtn" type="button" value="削除" />
                            </td>
                        </tr>
                        <tr>
                            <td>2</td>
                            <td>
                                <input class="delBtn" type="button" value="削除" />
                            </td>
                        </tr>
                        <tr>
                            <td>3</td>
                            <td>
                                <input class="delBtn" type="button" value="削除" />
                            </td>
                        </tr>
                        <tr>
                            <td>4</td>
                            <td>
                                <input class="delBtn" type="button" value="削除" />
                            </td>
                        </tr>
                    </tbody>
                </table>

            </form>
        </div>
        <script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
        <script type="text/javascript">
            $(".delBtn").on('click', function () {
                var tr = $(this).parents('tr');
                tr.addClass("active");
                if (confirm("よろしいですか?")) {
                    tr.addClass('deleted');
                    tr.removeClass('active');
                } else {
                    tr.removeClass('active');
                }
            });
        </script>
    </body>
</html>

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 90.51%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

  • 受付中

    jsp:submitのボタンの名前を変化させたい

    jspのsubmitについて質問です。 現在DBに接続してレコードの追加や更新や削除を行うコードを作成中です。 その追加と更新を同じjspコードで入力するようにしているので

  • 受付中

    forEach文でcheckboxをだすときに

    jspで、forEach文でcheckboxを出すとnameが同じになるので配列でパラメーターを受け取ります。 そのときチェックされたものが配列の[0]から入ってしまいますが、も

  • 受付中

    なぜ、index.jspからregisterUser.jspのリンク実行時にこのような404エラーが...

    なぜ、index.jspからregisterUser.jspのリンク実行時にこのような404エラーが出てしまうのでしょうか? 指定の名前を変更するなど行ったのですが、だめでした。

  • 解決済

    input type = "file" で画像をクリックして選択画面を出したい。

    連投失礼します。 下記2点質問がございますのでご教授いただければ幸いです。 よろしくお願いいたします。 ①input type "file"で画像ファイルを選ぶときに、もともと

  • 解決済

    セッションスコープの使い方

    java webアプリケーション 一つ目のjsp内のプルダウンメニューから項目Aを選択し、 その項目Aを2つ目のjspに表示させたい。  前提・実現したいこと 一つ目のjspか

  • 解決済

    テーブルから値を受け渡したい

     前提・実現したいこと 現在、JAVAで<c:forEach>でJSPに書きだしたテーブルから値をサーブレットに参照しようとしているのですが、一番最後に上書きしたものと思われるもの

  • 解決済

    jspとjavaのみでエクスポート出力

    サーブレットの勉強を始めて商品管理アプリを作成しています。 外部ファイル出力でつまずいているのでご教授いただけませんでしょうか? ◆関連ファイル ・jsp:insert.jsp

  • 解決済

    一部の値のみをservletへpostリクエストする方法

     前提・実現したいこと 更新ボタンを押下したとき更新ボタンの横列の値1のみをservletに送りたい。 ソースコード内のproductList.product_id に2つの値(1

同じタグがついた質問を見る

  • Java

    14050questions

    Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。