Что делает метод serialize в JQuery?

Денис Логвинец разместил пост 2 недель назад

Всем привет, пытаюсь разобраться в этом методе, точнее что он делает и для чего, но ничего не понимаю, очень нужна помощь, желательно с примером и описанием, а то что то эта тема очень плохо заходит в голову(

Глеб Гариев разместил пост 2 недель назад

Привет) это же вроде не сложный метод, тем более применение только одно, передавать ничего не надо, просто вызвать на объекте метолд serialize(), этот метод возвращает строку пригодную для передачи через URL строку, он собирает данные с объектов в JQuery, этот метод в частности упрощает работу с формой, так как может очень просто собрать данные с формы:

$( "form" ).on( "submit", function( event ) {
    event.
preventDefault();
   
console.log( $(this).serialize() );
});

В этом примере впринципе всё должно быть понятно, разве что строка event.preventDefault(), она отменяет дефолтные действия браузера, в данном случае например, при нажатии на кнопку отправить в форме, идет отсылка информации, но если использовать указанную выше строку, то этого не произойдет.

<form>
    <select
name="multiple" multiple="multiple">
        <option
selected="selected">One</option>
        <option>
Two</option>
        <option>
Three</option>
    </select>
    <br/>
    <select
name="single">
        <option>
Одиночный первый</option>
        <option>
Одиночный второй</option>
    </select>
    <br />
    <input
type="checkbox" name="check" value="check1" id="ch1"/>
    <label
for="ch1">Чекбокс один</label>

    <input
type="checkbox" name="check" value="check2" checked="checked" id="ch2"/>
    <label
for="ch2">Чекбокс два</label>
    <br />
</form>
<p
id="result"></p>
<script>

   
function showValues() {
       
var str = $("form").serialize();
       
$("#result").text( str );
   
}
    $(
"input[type='checkbox'], input[type='radio']").on( "click", showValues );
   
$("select").on( "change", showValues );
   
showValues();

</script>

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

Close