Надим

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

Делайте так:

$('.header-search__popup').click(function() {
    setTimeout(function() {
        $('input.aws-search-field').focus();
    }, 200);
});

Старый добрый for вам поможет:

var obj = {};

for (var n = 0; n < array.length; n++) {
    obj[array[n]['name']] = array[n]['value'];
}

console.dir(obj);

Используйте DOMParser. Применительно к вашему коду распарсить ответ можно вот так:

$.ajax({  
	url: my_url,  
	method: "GET",
	dataType: "html",
	success: function(html){
		var doc = new DOMParser().parseFromString(html, 'text/html');
		var txt = $('селектор_для_поиска', doc).text();
		alert(txt);
	}
});

Как видно из примера, чтобы что-то найти в полученном html, мы его сначала должны превратить в документ при помощи DOMParser, а затем банально передаем полученный документ вторым аргументом в функцию jQuery и в итоге jQuery искать элементы будет не на текущей странице, а конкретно в переданном документе.

Чтобы сделать такой функционал нужно знать:
1. Как делаются POST / GET запросы на JavaScript, а лучше разбираться в WebSocket и уметь его готовить
3. Иметь базовые навыки на каком-нибудь северном языке программирования, допустим тот же php
4. Также нужно уметь работать с базами данных (MySQL для php), чтобы хранить комнаты и пользователей
5. Дополнительно надо понимать, как при помощи JavaScript вообще взаимодействовать со страницей (ну там просчитать что-то, добавить, изменить, вывести и так далее)

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

Я нащупал два решения для этой проблемы.

Первый способ позволяет вставить произвольный Blob в поле <input type="file">. Итак, способ создания коллекции файлов FileList:

var info = 'Какой-нибудь текст';

var dt  = new DataTransfer();
dt.items.add(new File([info], 'primer.txt', {type: 'text/plain'}));
var file_list = dt.files;

console.log('Коллекция файлов создана:');
console.dir(file_list);

// Вставим созданную коллекцию в реальное поле:
document.querySelector('input[type="file"]').files = file_list;

Можно просто пересоздать коллекцию, если надо что-то удалить из поля.

Второй вариант позволяет получать заранее подготовленные коллекции файлов и далее их вставлять и использовать их где угодно. Для начала нам нужно подключить библиотеку localforage:

<script src="https://cdnjs.cloudflare.com/ajax/libs/localforage/1.9.0/localforage.js"></script>

Далее, мы можем выбрать файлы для коллекции и сохранить их в памяти браузера:

var input = document.createElement('input');
input.setAttribute('type', 'file');
input.setAttribute('multiple', 'multiple');
input.addEventListener('change', async function() {
	var files = await localforage.setItem('files', this.files);
	console.log('Коллекция файлов успешно сохранена:');
	console.dir(files);
});
input.click();

Сохраненную коллекцию мы позднее сможем использовать даже после перезагрузки страницы или закрытия / открытия браузера. Для извлечения сохраненной коллекции достаточно выполнить:

var files = await localforage.getItem('files');
console.log('Коллекция файлов успешно извлечена:');
console.dir(files);

Эта коллекция полноценная и мы легко можем ее прицепить в любое поле:

var files = await localforage.getItem('files');
document.querySelector('input[type="file"]').files = files;

При этом файлы в поле будут выглядеть точно так же, будто выбраны с компа, никаких отличий.

Лайфхак для создания коллекции файлов FileList:

var info = 'Какой-нибудь текст';

var dt  = new DataTransfer();
dt.items.add(new File([info], 'primer.txt', {type: 'text/plain'}));
var file_list = dt.files;

console.log('Коллекция файлов создана:');
console.dir(file_list);

// Вставим созданную коллекцию в реальное поле:
document.querySelector('input[type="file"]').files = file_list;

В переменную info вместо текста, можно положить в том числе и Blob - это особенность функции new File() которая первым параметром может принять как массив из текстов, так и массив из Blob.

Фактически лайфхак выше позволяет нам JavaScript-ом скачать любой какой угодно файл со своего сайта и вставить его абсолютно в любое поле <input type="file"> - что просто архиполезно для браузерных ботов.

Также способ выше можно применить для редактирования уже выбранных пользователем файлов. Например, если надо из поля выбора файлов убрать какие-то определенные файлы и при этом сделать не фиктивно, а реально.

Огромное спасибо пользователю Mmx Symfony, который нарыл это решение где-то в недрах иностранных сайтов. Сам я, в свое время сколько не искал, везде был ответ, что это невозможно, а оказалось, что нихрена подобного =)

Лайфхак для создания коллекции файлов FileList:

var info = 'Какой-нибудь текст';

var dt  = new DataTransfer();
dt.items.add(new File([info], 'primer.txt', {type: 'text/plain'}));
var file_list = dt.files;

console.log('Коллекция файлов создана:');
console.dir(file_list);

// Вставим созданную коллекцию в реальное поле:
document.querySelector('input[type="file"]').files = file_list;

В переменную info вместо текста, можно положить в том числе и Blob - это особенность функции new File() которая первым параметром может принять как массив из текстов, так и массив из Blob.

Фактически лайфхак выше позволяет нам JavaScript-ом скачать любой какой угодно файл со своего сайта и вставить его абсолютно в любое поле <input type="file"> - что просто архиполезно для браузерных ботов.

Также способ выше можно применить для редактирования уже выбранных пользователем файлов. Например, если надо из поля выбора файлов убрать какие-то определенные файлы и при этом сделать не фиктивно, а реально.

Огромное спасибо пользователю Mmx Symfony, который нарыл это решение где-то в недрах иностранных сайтов. Сам я, в свое время сколько не искал, везде был ответ, что это невозможно, а оказалось, что нихрена подобного =)

Лайфхак для создания коллекции файлов FileList:

var info = 'Какой-нибудь текст';

var dt  = new DataTransfer();
dt.items.add(new File([info], 'primer.txt', {type: 'text/plain'}));
var file_list = dt.files;

console.log('Коллекция файлов создана:');
console.dir(file_list);

// Вставим созданную коллекцию в реальное поле:
document.querySelector('input[type="file"]').files = file_list;

В переменную info вместо текста, можно положить в том числе и Blob - это особенность функции new File() которая первым параметром может принять как массив из текстов, так и массив из Blob.

Фактически лайфхак выше позволяет нам JavaScript-ом скачать любой какой угодно файл со своего сайта и вставить его абсолютно в любое поле <input type="file"> - что просто архиполезно для браузерных ботов.

Также способ выше можно применить для редактирования уже выбранных пользователем файлов. Например, если надо из поля выбора файлов убрать какие-то определенные файлы и при этом сделать не фиктивно, а реально.

Огромное спасибо пользователю Mmx Symfony, который нарыл это решение где-то в недрах иностранных сайтов. Сам я, в свое время сколько не искал, везде был ответ, что это невозможно, а оказалось, что нихрена подобного =)