Как сделать снимок заполненной формы в JavaScript?

Распространенным запросом является использование Библиотека JavaScript GrabzIt чтобы сделать снимок формы, которую заполнил пользователь. Однако, поскольку наши снимки берутся с удаленных серверов, GrabzIt не сможет сделать это без небольшой дополнительной работы. К счастью, вся эта работа была построена intо ConvertPage метод, если вы хотите получить дополнительную информацию, проверьте захват динамического контента.

Обратите внимание, что такие ресурсы, как CSS и JavaScript, невозможно загрузить, если веб-страница не доступна на intERNET. Ниже приведен пример использования этой функции.

<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@3.5.2/grabzit.min.js"></script>
</head>
<body onload="loadFromQueryString()">
<form id="myForm">
<label>Name</label> <input type="text" name="fullname" data-gt-translate-attributes='[{"attribute":"value","format":"json"}]' value="Sam"/><br/>
<label>Order</label> <select name="order">
<option data-gt-translate-attributes='[{"attribute":"value","format":"json"}]' value="Computer">Computer</option>
<option data-gt-translate-attributes='[{"attribute":"value","format":"json"}]' value="Monitor">Monitor</option>
<option data-gt-translate-attributes='[{"attribute":"value","format":"json"}]' value="Printer">Printer</option>
</select><br/><br/>
<input type="button" data-gt-translate-attributes='[{"attribute":"value","format":"json"}]' value="Take Screenshot" onclick="createScreenshot();"/>
</form>
<div id="divResult"></div>
<script type="text/javascript">
function createScreenshot()
{
    //dynamically capture the page and add it to the div.
    GrabzIt("Sign in to view your Application Key").ConvertPage().AddTo('divResult');
}
</script>
</body>
</html>

Дополнительные статьи о веб-захвате Сообщество Вопросы