3

我在 jquery 对话中有一个表格。提交表单后如何获取所选复选框的值？

$(document).ready(function(){

var $dialog = $('<div></div>')
    .html('<form id="myform" action=""><input type="checkbox"   id="completeCheck" name="completeCheck" value="" />Complete check<br /><input type="checkbox" name="view" value="Car" /> View report <br /><input type="checkbox" name="consist" value="" />Consistency check<br /><input type="checkbox" name="other" value="" />Other checks<br /><input type="checkbox" name="keyCheck" value="" />Key check<br /><input type="checkbox" name="compareCheck" value="" />Compare check<br /></form>')
    .dialog({
        autoOpen: false,
        title: 'Data check',
        buttons: {
          "Submit Form": function() {  $('form#myform').submit();},
          "Cancel": function() {$(this).dialog("close");}
        }
    });

$('#createNew').click(function() {
    $dialog.dialog('open');
    // prevent the default action, e.g., following a link
    return false;
});

$('form#myform').submit(function(){

  $dialog.dialog('close');
});        


});
4

3 回答 3

3

工作演示 http://jsfiddle.net/9mZAJ/2/ 或 http://jsfiddle.net/9mZAJ/1/

$('#completeCheck').is(':checked')将在复选框休息时与循环一起完成这个技巧，.each请参见演示和下面的代码。

这应该有帮助

现在要遍历所有复选框，您可以使用.each和 with is(":checked")check 以多种方式执行此操作。:)

代码

$(document).ready(function(){

var $dialog = $('<div></div>')
    .html('<form id="myform" action=""><input type="checkbox"   id="completeCheck" name="completeCheck" value="" />Complete check<br /><input type="checkbox" name="view" value="Car" /> View report <br /><input type="checkbox" name="consist" value="" />Consistency check<br /><input type="checkbox" name="other" value="" />Other checks<br /><input type="checkbox" name="keyCheck" value="" />Key check<br /><input type="checkbox" name="compareCheck" value="" />Compare check<br /></form>')
    .dialog({
        autoOpen: false,
        title: 'Data check',
        buttons: {
          "Submit Form": function() {  $('form#myform').submit();},
          "Cancel": function() {$(this).dialog("close");}
        }
    });

$('#createNew').click(function() {
    $dialog.dialog('open');
    // prevent the default action, e.g., following a link
    return false;
});

$('form#myform').submit(function(){
    alert('completeCheck checkobox is checked or not ==> ' + $('#completeCheck').is(':checked'));

  $dialog.dialog('close');
});        


});​

像这样循环

$(this).find('input[type="checkbox"]').each(function(){
    alert($(this).is(':checked'));
})

图片

在此处输入图像描述

于 2012-07-03T08:16:03.973 回答
2

$(this).find(":checked")您可以在表单提交回调中获取所有选中的复选框。然后，您可以遍历它们并获取它们的值。

这是一个示例，说明如何将选中的复选框的名称及其值存储在数组中，例如：

$('form#myform').submit(function(){
  // Store names of the checkboxes and their values in an array
  var values = []; 
  $(this).find(":checked").each(function () {
     values[$(this).prop("name")] = $(this).val();
  });
  $dialog.dialog('close');
});
于 2012-07-03T08:14:52.200 回答
1

在您的提交功能中：

$(this).find(':checkbox').each(function(){
    if(this.checked)
        alert(this.name + ' is checked');
    else
        alert(this.name + ' is not checked');
});

见http://jsfiddle.net/tricki/mwJqR/2/

于 2012-07-03T08:16:19.353 回答