【JQuery】hidden要素を追加/差し込むサンプル

JQueryを使った、hidden要素を後から追加するサンプルです。

既に同じクラスのhiddienが存在した場合でも、差し替えてくれるので便利!えらい!

 

/**
 *  特殊セレクトボックスの選択値からinput(hidden)タグを作成する
 * @param {String} name(hidden要素の名前)
 * @param {String/Array} values(hidden要素が保持する値)
 * @returns {undefined}
 */
function appendHidden(name, value) {
    // 対象divタグが存在しているかチェック
    if($('#hidden-' + name).length) {
        console.log("$('.hoge').length の結果: true");
        // 対象divタグが存在している場合は子要素ごと削除する
        $('#hidden-' + name).remove();
    } else {
        console.log("$('.hoge').length の結果: false");
    }
    // 変更された検索条件の項目名を入れるHiddenを作成
    var html = "<div id='hidden-" + name + "'>";
    // 変更された検索条件の値を入れるHiddenを作成
    if (value instanceof Array) {
        for (var i=0; i<value.length; i++) {
            html += "<input type='hidden' name=" + name + "[" + i + "] value='" + value[i] + "' >";
        }
    } else {
        html += "<input type='hidden' name='" + name + "' value='" + value + "' >";
    }
    html += "</div>";
    $("body").append(html);
}

 



投稿日:2020-03-11    更新日:2020-03-11

[スポンサーリンク]

関連記事
勉強した内容を緩くメモする|JBの技術メモ
勉強した内容を緩くメモする|JBの技術メモ
勉強した内容を緩くメモする|JBの技術メモ
勉強した内容を緩くメモする|JBの技術メモ
勉強した内容を緩くメモする|JBの技術メモ
勉強した内容を緩くメモする|JBの技術メモ
サイト内検索
プロフィール

プロフィール

[Name : じゃぶじゃぶ(@jbjb_2019)]
都内で社内SEをしているおじさん。
仕事で得られる知識だけでは限界を感じ、 WEBの勉強がてらITブログを開始。
サーバからWEBサイトまでフルスクラッチで開発しました。
現在は勉強のモチベーションを保つために活用中。
興味があることを雑記的に書いていきます。

[スポンサーリンク]

[スポンサードリンク]