用於多個子級輸入的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的一個元素

回答

相關問題