用于多个子级输入的JQuery选择器div的一个元素

我想选择特定div中的所有输入。 div的输入是1和2的子深度。我能够获得第一级输入，而不是第二级输入。这里是我的代码： -用于多个子级输入的JQuery选择器div的一个元素

HTML

<div class="col-xs-11 ajax-form"> 
    <input type="hidden" name="user_id" value="4"> 
    <label class="checkbox-inline"><input name="2" type="checkbox" value="Sudo"> Sudo</label> 
    <label class="checkbox-inline"><input name="1" type="checkbox" value="Admin"> Admin</label> 
    <label class="checkbox-inline"><input name="3" type="checkbox" value="Client"> Client</label> 
</div>

JS：

$(document).ready(function() { 
    var data = $('.ajax-form :input').serialize(); 
    console.log(data); 
});

我的输出：

USER_ID = 4

这里是我的jsfiddle

谢谢你的任何和所有帮助。

来源

2017-03-27 user908759

所以你要选择的第一个输入（隐藏的一个），而不是其他人？或者你想让他们都？ – aeid

原因，为什么你的代码不工作，你的代码不工作： -

1.In代码时文件已准备就绪，没有复选框被选中，这就是为什么有值不是序列化数据的到来。

解决方案： - 添加checked属性的复选框象下面这样： -

例子： -

$(document).ready(function() { 
 
    var data = $('.ajax-form :input').serialize(); 
 
    console.log(data); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="col-xs-11 ajax-form"> 
 
    <input type="hidden" name="user_id" value="4"> 
 
    <label class="checkbox-inline"><input name="2" type="checkbox" value="Sudo" checked> Sudo</label> 
 
    <label class="checkbox-inline"><input name="1" type="checkbox" value="Admin" checked> Admin</label> 
 
    <label class="checkbox-inline"><input name="3" type="checkbox" value="Client" checked> Client</label> 
 
</div>

另一种选择做同样的： -

2.创建一个按钮并点击按钮，点击尝试序列化div元素数据。然后无需添加checked属性。它将动态工作。

例子： -

$(document).ready(function() { 
 
    $('#serialize_div_data').click(function(){ 
 
     var data = $('.ajax-form :input').serialize(); 
 
     console.log(data); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <div class="col-xs-11 ajax-form"> 
 
     <input type="hidden" name="user_id" value="4"> 
 
     <label class="checkbox-inline"><input name="2" type="checkbox" value="Sudo"> Sudo</label> 
 
     <label class="checkbox-inline"><input name="1" type="checkbox" value="Admin"> Admin</label> 
 
     <label class="checkbox-inline"><input name="3" type="checkbox" value="Client"> Client</label> 
 
</div> 
 
<input type="button" id = "serialize_div_data" value="Click Me to serailized the div data">

来源

2017-03-27 11:31:49

您正在使用：

$('.ajax-form :input')

这将让这些被检查的复选框的值。

检查更新JSFiddle Link

在这个我已经把checked属性在一个复选框，你会在jquery代码得到它的价值。因此，要获得chekbox值，您还必须处理选中/未选中的事件。

来源

2017-03-27 04:24:39

，因为当你加载形成你的复选框，不检查，因此不考虑

试试下面的代码形式的值，当你的数据在负载页

 

    &ltdiv class="col-xs-11 ajax-form"> 
     &ltinput type="hidden" name="user_id" value="4"> 
     &ltlabel class="checkbox-inline">&ltinput name="2" type="checkbox" value="Sudo" checked> Sudo</label> 
     &ltlabel class="checkbox-inline">&ltinput name="1" type="checkbox" value="Admin" checked> Admin</label> 
     &ltlabel class="checkbox-inline">&ltinput name="3" type="checkbox" value="Client" checked> Client</label> 
    </div>

来源

2017-03-27 04:54:54

用于多个子级输入的JQuery选择器div的一个元素

回答

相关问题