【问题标题】:JQuery making an object of all checkboxesJQuery制作所有复选框的对象
【发布时间】:2013-07-01 16:47:57
【问题描述】:

我有一个站点,其上的链接(hrefs)很少,每个链接都显示一组输入 type=checkbox(从后台生成),当您单击它显示的链接时,可以说 10 个输入,其他的变成显示:无;(加载时,默认情况下只有一组初始复选框)和我制作的 jquery,因此您可以切换您想要查看的复选框。

现在我需要创建一个对象,我可以在其中放置所有检查的内容、名称和值,因此当我单击按钮时,我可以通过 ajax 将其发送到后端。

调用ajax的函数“并获取值和名称是”:

function Bada() {

    var obj = $('.custom input[type="checkbox"]');


    var checkedCount =  obj.filter(':checked').length;
    var checkedInputs = obj.filter(':checked');
    console.log('The console is working');
    for(check in checkedInputs){
        console.log(checkedInputs[check].name);
        console.log(checkedInputs[check].value);
    } 
    delete window.checkedInputs;
    delete window.obj;

             $.ajax({
                 url: "/getItems",
                 type: "post",
                 data : { form: childCount, count: checkedCount },
                 success:  function(responseText){

                     alert('works');

                 }
             })
             //unfocus the button after the call to server, otherwise the marker stays in the text of the button as if that text is selected
             $('.button').blur();

    }

我遇到的问题如下: 当页面加载并且视图上有那些初始复选框时(其他的在显示中:无;),一切正常,我得到一个复选框的名称和值, 但是,当我单击一个链接并设置显示其他复选框并将以前的复选框置于显示中时:none;,当我再次单击该按钮时,而不是获取选中复选框的名称和/或值显示所有以前的复选框(选中和未选中,它们的整个列表,以前 和当前显示的也是,但如果有任何选中或未选中,则完全忽略)。 所以我认为我创建了一个对象,它保留了这些值,不会覆盖它们,而是向以前添加新值并且完全困惑为什么它突然忽略过滤器,这就是为什么我试图通过删除来“清空”对象window.obj;,但它没有做任何事情。 那么这里有什么问题呢?如果对我所写的内容有任何一般性提示,将很高兴听到它们:) 谢谢!

【问题讨论】:

  • 这里 obj 和 checkedInputs 不是全局窗口对象的一部分
  • 你有一些我们可以看到的示例 html,也许是a live demo?帮助我们为您提供帮助。

标签: jquery html object checkbox filter


【解决方案1】:

隐藏时不发送输入。它是 HTML 标准的一部分。 表单发送的输入仅可见对象。

childCount 未定义。

【讨论】:

  • 这不是真的。 disabled 输入未发布,但 hiddeninput type='hidden'.. 元素已发布。
  • 不确定发送是什么意思,如果您的意思是它们没有发送到服务器,那么这不是我在这里做的。我正在尝试使用这些输入构建和反对,然后发送它。一切正常,直到我尝试从以前显示的对象构建该对象:无;复选框到现在(单击链接后)显示:块;。并且 jQuery 看到这些输入,但是过滤器在 :checked 上被忽略
  • 当我点击一个href时,我也用下面的代码清除了所有的复选框:$(function(){ var checked = true; $('.custom input[type= "checkbox"]').prop('checked', check).next().toggleClass('checked', false); });
  • 这是一个 jsfiddle 链接:jsfiddle.net/startup2013/r8ker/3 名称是生成的,可以是随机的,它们是从服务器检索的,与值和数量相同。在这个例子中,我需要获取名称和所有检查的值(可以有多达 100 个(名称或类别和这些类别中的值),没关系,只要我得到相应的名称以及要发送到服务器的值列表)。
  • 使用数组格式的多个输入[]:jsfiddle.net/r8ker/15 和 serialize() 函数。
【解决方案2】:

您可以尝试将所有复选框推入一个数组,然后将它们存储到一个变量中,如下所示:

    function Bada() {

     var checkboxes= [];
        $('.checkBoxClass').each(function(index){
            checkboxArray.push($(this).data('id'));
        });
        var together = checkBoxArray.join();

        $.ajax({
            url     : '/getItems',
            data    : {
                    'someproperty'      : together
            },
        success : function(response) { 
        console.log(response);
        } ...

在您在标记中为复选框提供一些 data-id 的条件下,并且该 data-id 不是动态创建的。这样,您将正确存储和发送所有复选框以及您可能拥有的任何其他数据,这只是您可以尝试的示例。

当我需要存储多个选中/未选中的选项并通过 AJAX 发送时,我使用了类似的方法。

如果这对您有任何帮助,请告诉我。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-01-29
    • 2013-02-02
    • 1970-01-01
    • 2018-09-15
    • 2015-02-19
    • 2013-10-10
    相关资源
    最近更新 更多