2. 程式人生 > >獲取checkbox選中的值，提交Form表單

獲取checkbox選中的值，提交Form表單

阿新 • • 發佈：2018-12-20

點選提交按鈕的時候，將所有CheckBox選中項彈出顯示。

<script src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js"></script>
<input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="1" />
                    <label>幻覺</label>

                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="2" />
                    <label>交流困難</label>

                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="3" />
                    <label>猜疑</label>

                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="4" />
                    <label>喜怒無常</label>
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="5" />
                    行為怪異
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="6" />
                    興奮話多
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="7" />
                    <label>傷人毀物</label>
                    <br />
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="8" />
                    <label>悲觀厭世</label>

                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="9" />
                    <label>無故外走</label>
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="10" />
                    <label>自言自語</label>
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="11" />
                    孤僻懶散
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="12" />其他
                    <input type="hidden" name="Jszzdm" id="Jszzdm" value="@Model.Jszzdm" />
<input type="button" value="GET" onclick="alert($('input[type=checkbox]:checked').map(function(){return this.value}).get().join(','))"/>

 

將CheckBox的選中值放到隱藏域中，點選提交時彈出顯示。

<script src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js"></script>
<input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="1" />
                    <label>幻覺</label>
 
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="2" />
                    <label>交流困難</label>
 
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="3" />
                    <label>猜疑</label>
 
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="4" />
                    <label>喜怒無常</label>
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="5" />
                    行為怪異
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="6" />
                    興奮話多
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="7" />
                    <label>傷人毀物</label>
                    <br />
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="8" />
                    <label>悲觀厭世</label>
 
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="9" />
                    <label>無故外走</label>
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="10" />
                    <label>自言自語</label>
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="11" />
                    孤僻懶散
                    <input name="Jszzdm1" id="Jszzdm1" type="checkbox" value="12" />其他
                    <input type="hidden" name="Jszzdm" id="Jszzdm" value="@Model.Jszzdm" />
<script>
  $('input[type=checkbox]').change(function(){
    $('#Jszzdm').val($('input[type=checkbox]:checked').map(function(){return this.value}).get().join(','))
  })
</script>
<input type="button" value="GET" onclick="alert($('#Jszzdm').val())"/>

相關推薦

獲取checkbox選中的值，提交Form表單

點選提交按鈕的時候，將所有CheckBox選中項彈出顯示。 <script src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js"></script> <input name="Jszzdm1" id

檔案上傳下載時，在form表單中設定屬性enctype=“multipart/form-data”的情況下，如何獲取表單提交的值？

一、問題描述 檔案上傳下載時，在form表單中設定屬性enctype=“multipart/form-data”的情況下，如何獲取表單提交的有關使用者資訊的值？（比如：textfield、radio等屬性中的值） 二、解決方法 1、情況一：沒有對user物件進行封裝 方法：

JQuery提交Form表單，獲取返回值

$.post("/Feedback/wtdata/save.do", $("#wdsform").serialize(), function(data){ alert(data.message); }

如何通過submit提交form表單獲取後臺傳來的返回值

 小夥伴是不是遇到過這樣的問題，通過submit提交form表單的時候，不知怎麼獲取後臺傳來的返回值。有的小夥伴就會說你不會發送ajax，其實小編也會。假如提價的form表單中含有檔案，怎麼辦？（注：

提交Form表單，POST和GET方式的傳值問題。

<form action="${pageContext.request.contextPath }/UserServlet?id=123" method="get"> userame:<input type="text" name="username"&

使用ajax提交form表單，包括ajax文件上傳 轉http://www.cnblogs.com/zhuxiaojie/p/4783939.html

ima option img jquery選擇器 open request resp logs ges 使用ajax提交form表單，包括ajax文件上傳 前言 使用ajax請求數據，很多人都會，比如說： $.post(path,{data:data},function

使用ajax提交form表單，包括ajax文件上傳

開發者 使用 sub 決定 發現 cli 也會 pos pre 前言使用ajax請求數據，很多人都會，比如說：$.post(path,{data:data},function(data){ ...},"json");又或者是這樣的ajax$.ajax({

ajax提交form表單，H5的required屬性沒起作用

1、 ajax提交form表單，required屬性不起作用 錯誤程式碼如下 <form id="order"> <input type="text" name="name" required /> <input type="submit

怎麼讓jsp頁面自己定時點選提交按鈕，完成form表單提交到servlet事件

這個涉及到js的每隔幾秒提交事件 <script type="text/javascript"> function dtime(){ setInterval(sub(), 30000); } function sub(){ document.getEle

Ajax應用serialize()提交Form表單及後端取值（Java）

<script type="text/javascript"> $(document).ready(function(){ $("#modifyForm").submit(function(e){ $("#submitButton").attr('disabled',"

js處理得到的值怎麼跟隨form表單提交到servlet後臺

案例： 背景：通過js獲取select被選中的值，但是js處理得到的值ss是需要跟隨form表單提交到servlet後臺 我在jsp某個位置；但是這個input要在form表單裡面； display: block;可以看見的 display: none;隱藏起

ajax提交form表單，包括ajax檔案上傳

使用ajax請求資料，很多人都會，比如說： $.post(path,{data:data},function(data){ ... },"json"); 又或者是這樣的ajax $.ajax({ url:"${pageCont

action提交form表單，用於登入請求，servlet接收資料

今天發現登入需要用action提交form表單，然後通過後臺決定跳轉是否成功安全性較高。之前使用前端location.href來實現跳轉，安全性很低，被測試部門打回重做。 action總結： html寫法： <form id="signin-form_id" met

Ajax提交form表單，Ajax檔案上傳

平時我們會用到各種各樣的Ajax請求資料方式，下面我們就來說一下這個Ajax的表單提交，檔案上傳等等。。。 1.第一種，.post，.get方式 $.post(path,{data:data},function(data){ if（success){ }

ajax提交form表單到servlet，網頁的跳轉

jsp介面如下： <%@ page language="java" contentType="text/html; charset=UTF-8"     pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3

layer.js 彈出層提交form表單，action重定向

layer.js，一個jquery的外掛，可以用它來做資訊提示，彈出層等。  使用layer.js做彈出層時，在彈出層裡直接提交form表單，返回的畫面仍然停留在彈出層裡。 我們想在彈出層裡提交form表單後關閉彈出層，並跳轉到另一個畫面。 0.引入layer.j

ajax提交form表單，使用FormData。JQuery3.2

FormData這種用ajax提交form的方式在老版的JQ中是不行，我使用的是3.2版本,程式碼如下 <form id="formTest" action="ajaxTe" method="post" enctype="multipart/form-d

Jquery繫結事件，模擬form表單提交

//Jquery物件繫結事件： $("#clean").bind('click',function(){ //程式碼區 }); //取消按鈕繫結的時間： $("#save").attr("onclick","javascript:void(0)"); //

js提交form表單，並傳遞引數

//增加的函式 begin function queryFun(){ var type = $("#artType").val(); var hasInputed = "1";//表示輸入了要搜尋 的資訊 if($("#query").val()=="選手姓名/編號"){

ajax提交form表單，關鍵程式碼：$("#theForm").serialize()

原始ajax提交： $.ajax({ type: "POST", data:"processId="+$("#processId").val()+"&delstepids="+delstepids, url: "./delSte