2012-01-09 2 views
5

Я по-прежнему немного новичок в кодировании dojo, javascript и HTML. Я унаследовал право собственности на HTML-страницу, которая кодируется с использованием dojo 1.4.2 (будет обновляться в будущем) и javascript. По существу, страница HTML содержит форму, которая первоначально отображается пользователю. После того, как пользователь заполнит форму и отправит ее, форма будет заменена сгенерированным контентом на основе их ответов.Как сделать динамическую или сгенерированную HTML-страницу полезной?

Это делается с помощью ответов в форме, чтобы выявить или скрыть различные элементы div, которые уже содержатся в файле HTML. Таким образом, форма скрыта и обнаруживается некоторое подмножество других элементов div.

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

Мне сказали, что это можно сделать, передав данные службе (возможно, JSP), которая обрабатывала бы это и передавала обратно браузеру. Однако я не знаком с этим и не смог найти никаких примеров. Есть ли способ сделать это, и у кого-нибудь есть какие-то примеры или документация, на которые можно было бы обратить внимание?

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

Заранее спасибо.

+0

Является ли контент только элементами формы (входами), или вы обновляете DIVs/SPAN (другие элементы HTML)? – vol7ron

+0

Элементы формы сначала расположены в верхней части HTML, но после нажатия кнопки отправки. Отображаемое «сгенерированное» содержимое - это не что иное, как DIVs/SPAN и т. Д. Внизу страницы HTML, которые отображаются путем обновления стиля. – piperp

ответ

1

Вы можете ввести механизм, который вносит изменения в страницу в соответствии с параметрами URL (т. Е. Содержимое строки синтаксического анализа).

I.e. дали URL, содержащий часть запроса (например http://your.site.com/path/to/page?p1=true & р2 = истинные) в Element ы преобразуются в p1 или p2 бы показать; другие - нет.

+0

Учитывая мой опыт и таймфреймы, я с меньшей вероятностью пойду по этому пути, но спасибо за вход. – piperp

+0

Мы закончили этот путь из-за ограничений в использовании дополнительных инструментов. Мы также превратили HTML-страницу в JSP, чтобы упростить задачу. Комбинация позволила нам сохранить статическую копию. – piperp

+0

Приятно слышать! Отлично сработано. – FK82

1

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

Это an example сценария.

Просто отбросьте три вещи в dist везде, где есть другие файлы javascript. Включите скрипты swfobject.js и bhd.js в голову. Включите некоторый HTML, как это в теле: <div id="dl_button"></div>

На странице загрузки, запустите скрипт так:

var dlBtn = new BHD.Button({ 
    // id of the element to replace with this button (required) 
    id:'dl_button', 
    // button image 
    sprite:'buttons.png' 
},function(){ 
    // set default filename 
    dlBtn.setFile('untitled.html'); 
    // set file contents 
    dlBtn.setData('<html>' + document.documentElement.innerHTML + '</html>'); 
}); 

Ваш «buttons.png» должен выглядеть примерно так (спрайт с 3 государств возлагают вертикально):

button sprite

Если все было сделано правильно, нажав на кнопку следует предложить пользователю загрузить копию текущего состояния страницы.

+0

Спасибо. Я посмотрю и попробую на этой неделе, прежде чем пометить решение, которое работает для меня. – piperp

1

Используя что-то вроде JQuery, это просто, чтобы получить все отображаемое содержимое HTML:

$(document).ready(function(){ 
    var rendered = $('html').html(); // store this in some variable 
}); 

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

Internet Explorer может быть исключением, если используется ActiveX или execCommand (http://4umi.com/web/javascript/filewrite.php). В противном случае вам придется использовать сторонний инструмент/плагин (например, Flash), как указывал GGG.

+0

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

+0

Точно. Чтобы быть кросс-браузерным, вы должны использовать дополнительный плагин (например, Flash) по соображениям безопасности. Представьте, если вы просмотрели сайт из списка Google, и у него была возможность записать [/ read] на [/ from] ваш жесткий диск. Он может принимать вашу конфиденциальную информацию или легко передавать вирусы, не делая ничего, кроме просмотра веб-страницы. Это была бы самая небезопасная вещь. – vol7ron

3

Как насчет bookmarklet вот так?

javascript:document.location='data:text/html,'+document.all[0].innerHTML; 

Он работает путем доступа к HTML-представление текущего DOM, а затем перенаправляет на новую страницу который построен из HTML-разметки, используя Data URI scheme.

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

Смежные вопросы