получить текстовые поля, которые не являются пустыми

Question

Давайте предположим, что у меня есть HTML-структуру, как это:

<div class="container"> 
    <input type="text" class="userInfo" name="first_name1" value="First name 1" /> 
    <input type="text" class="userInfo" name="first_name2" value="First name 2" /> 
</div> 

<div class="container"> 
    <input type="text" class="userInfo" name="first_name3" value="First name 3" /> 
    <input type="text" class="userInfo" name="first_name4" value="First name 4" /> 
</div> 

Как получить все текстовые поля, которые не являются пустыми, когда пользователь нажимает на кнопку с JQuery?

После того, как я получаю их, я хочу построить пару строку ключ-значение (сцепленный с &) для передачи в качестве параметра в URL, например:

"first_name1='First name 1&first_name2=First name 2'.... 

Answer 1

Вы можете использовать .filter() method, чтобы найти все в input элементы, которые содержат значения:

Example Here

var $fieldsWithValues = $('input').filter(function() { 
    return this.value; 
}); 

---

На основе вашего редактирования, вы можете построить строку запроса, используя $.param() function:

Example Here

var params = {}; 
var $fieldsWithValues = $('input').filter(function() { 
    return this.value.trim(); 
}).each(function() { 
    params[this.name] = this.value; 
}); 

console.log($.param(params)); 

выше будет войти:

"first_name1=First+name+1&first_name2=First+name+2&first_name3=First+name+3&first_name4=First+name+4" 

Answer 2

$(function(){ 

    $("#yourButtonId").click(function(e){ 
    e.preventDefault(); 

     var emptyItems=[]; 
     var items = $("input.userInfo"); 

     $.each(items,function(i,k){ 
     var item =$(this); 
     if(item.val()!="") 
     { 
      emptyItems.push(item.attr("name")); 
     } 
    }) 
    console.log(emptyItems);   
    }) 

}) 

Теперь emptyItems будет имена непустых текстовых полей

Рабочий образец here

Answer 3

Я не думаю, что для этого есть быстрый селектор, где jQuery скрывает всю работу. Вам нужно будет найти входные данные, а затем перебрать их и проверить их значения.

var inputsWithValue = $('input').filter(
    function() { 
     return $(this).val(); 
    } 
);