jQuery serialize() loại trừ tất cả các phần tử trong div.classname

Tôi đang cố gắng loại trừ các giá trị biểu mẫu vô hình từ đầu ra jQuery(). Các đầu vào/lựa chọn vô hình nằm bên trong div.ui-tabs-hide div's. Không phải con cái của nó, mà là hậu duệ. Vì vậy, về cơ bản, tôi cần bao gồm tất cả các phần tử (input, select) witin div mà không có ui-tabs-hide class AND loại trừ tất cả các phần tử (input, select) trong div's với ui-tabs-hide class trong một form.jQuery serialize() loại trừ tất cả các phần tử trong div.classname

Ngay bây giờ với những gì tôi đã thử nó bao gồm tất cả các phần tử biểu mẫu, nhưng tôi nghĩ rằng tôi đã không chỉ định bộ chọn đúng.

Xem bên dưới đoạn code để tạo lại vấn đề:

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function() { 
       var formdata = $("#outboundcall:not(.ui-tabs-hide input, .ui-tabs-hide select)").serialize(); 

       console.log(formdata); 
      }); 
     </script> 
     <meta charset="utf-8" /> 
     <title>JS Bin</title> 
    </head> 
    <body> 
     <form id="outboundcall"> 
     <div class="content"> 
      <div class="tabs ui-tabs ui-widget ui-widget-content ui-corner-all"> 
       <ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all"> 
        <li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"> 
         <a href="#tabs-1">Credit Card</a> 
        </li> 
        <li class="ui-state-default ui-corner-top"> 
         <a href="#tabs-2">Cheque</a> 
        </li> 
        <li class="ui-state-default ui-corner-top"> 
         <a href="#tabs-3">Direct Debit</a> 
        </li> 
       </ul> 
       <div id="tabs-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom"> 
        <input type="hidden" value="1" name="lead-payment-method" /> 
       </div> 
       <div id="tabs-2" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide"> 
        <p>Cheque functionality is not currently available.</p> 
       </div> 
       <div id="tabs-3" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide"> 
        <input type="hidden" value="3" name="lead-payment-method" /> 
       </div> 
      </div> 
     </div> 
     </form> 
    </body> 
</html>

Dưới đây là jsbin với mã này: http://jsbin.com/iyevux/5/

Nguồn

2013-04-29 Alexey

Bạn có thể áp dụng :not() để class selector của bạn, sau đó kết hợp trẻ em tử form với bộ chọn :input:

var formdata = $("#outboundcall :not(.ui-tabs-hide) > :input").serialize();

Nguồn

2013-04-29 09:33:37

vừa thử rằng: http://jsbin.com/iyevux/8/ và stil nó ghi lại cả hai giá trị đầu vào. Hay tôi đã bỏ lỡ điều gì đó? – Alexey

@ Alexey, thực sự, tôi nên đã sử dụng một bộ chọn con thay vì một bộ chọn con cháu. Câu trả lời giờ đã được sửa. –

Tuyệt vời, cảm ơn! hoạt động: http://jsbin.com/iyevux/14/ – Alexey

Hãy thử cách này:

$(document).ready(function() { 
    var formdata = $("#outboundcall:not(.ui-tabs-hide) input,#outboundcall:not(.ui-tabs-hide) select").serialize(); 
    console.log(formdata); 
});

hay

$(document).ready(function() { 
    var formdata = $("#outboundcall").find(":input:not(:hidden)").serialize(); 
    console.log(formdata); 
});

Từ jQuery: form serialize, hidden fields, and not displayed fields

Nguồn

2013-04-29 09:41:32

tùy chọn đầu tiên: http://jsbin.com/iyevux/11/ (vẫn ghi nhật ký cả hai giá trị) – Alexey

tùy chọn thứ hai: http://jsbin.com/iyevux/ 12/(log chuỗi rỗng) – Alexey

này sẽ làm việc:

$(document).ready(function() { 
    var formdata = $("#outboundcall input").not(".ui-tabs-hide input").serialize(); 

    console.log(formdata); 
});

Xin lỗi trước đó tôi không hiểu câu hỏi hoàn toàn, sẽ xóa câu trả lời

Nguồn

2013-04-29 09:56:20 dexterous

jQuery serialize() loại trừ tất cả các phần tử trong div.classname

Trả lời

Các vấn đề liên quan