Итерация через FormData в IE

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

Chrome позволяет перебирать коллекцию, но IE не предоставляет те же методы.

ниже код работает в Chrome:

// Create a test FormData object
var formData = new FormData();
formData.append('key1', 'value1');
formData.append('key2', 'value2');

// Display the key/value pairs
for(var pair of formData.entries()) {
   console.log(pair[0]+ ', '+ pair[1]); 
}

JS Fiddle

кто-нибудь знает, как достичь того же результата в IE? Спасибо.

6
internet-explorer javascript

2 ответов

здесь FormData polyfill это работает. Подробнее читайте их документы.

т. е. 10, т. е. 11 и Edge

чтобы он работал с IE 10 и выше, вам просто нужно добавить WeakMap polyfill как хорошо.

JSBin демо для IE10 и выше.

<script src="https://unpkg.com/weakmap-polyfill/weakmap-polyfill.min.js"></script>
<script src="https://unpkg.com/formdata-polyfill"></script>

<form action="" id="f">
    <input type="text" name="i1" value="v1">
    <input type="text" name="i2" value="v2">
</form>

<script type="text/javascript">
    console.clear();

    // Create a test FormData object
    var formData = new FormData();
    formData.append('key1', 'value1');
    formData.append('key2', 'value2');

    // Display the key/value pairs
    var formDataEntries = formData.entries(), formDataEntry = formDataEntries.next(), pair;
    while (!formDataEntry.done) {
        pair = formDataEntry.value;
        console.log(pair[0] + ', ' + pair[1]);
        formDataEntry = formDataEntries.next();
    }

    // or, if you are really into compact code
    var es, e, pair;
    for (es = formData.entries(); !(e = es.next()).done && (pair = e.value);) {
        console.log(pair[0] + ', ' + pair[1]);
    }

    // testing getting from form
    var myForm = document.getElementById('f');
    for (es = new FormData(myForm).entries(); !(e = es.next()).done && (pair = e.value);) {
        console.log(pair[0] + ', ' + pair[1]);
    }
</script>

код выше подбирает последние версии. Проверенные версии:https://unpkg.com/weakmap-polyfill@2.0.0/weakmap-polyfill.min.js и https://unpkg.com/formdata-polyfill@3.0.9/formdata.min.js


IE11 и Edge:

Если вам нужен только IE 11 и выше, вы можете снять WeakMap's polyfill и просто держать FormData ' s.

JSBin демо здесь.

<script src="https://unpkg.com/formdata-polyfill"></script>

<form action="" id="f">
    <input type="text" name="i1" value="v1">
    <input type="text" name="i2" value="v2">
</form>

<script type="text/javascript">
    console.clear();

    // Create a test FormData object
    var formData = new FormData();
    formData.append('key1', 'value1');
    formData.append('key2', 'value2');

    // Display the key/value pairs
    var formDataEntries = formData.entries(), formDataEntry = formDataEntries.next(), pair;
    while (!formDataEntry.done) {
        pair = formDataEntry.value;
        console.log(pair[0] + ', ' + pair[1]);
        formDataEntry = formDataEntries.next();
    }

    // or, if you are really into compact code
    var es, e, pair;
    for (es = formData.entries(); !(e = es.next()).done && (pair = e.value);) {
        console.log(pair[0] + ', ' + pair[1]);
    }

    // testing getting from form element
    const myForm = document.getElementById('f');
    for (es = new FormData(myForm).entries(); !(e = es.next()).done && (pair = e.value);) {
        console.log(pair[0] + ', ' + pair[1]);
    }
</script>

код выше подбирает последнюю версию. Проверенная версия:https://unpkg.com/formdata-polyfill@3.0.9/formdata.min.js

4
var unindexed_array = form.serializeArray();

$.map(unindexed_array, function(n, i){
     console.log(n['name']+ ', '+ n['value']);         
});

этот код дает тот же результат в IE

-1