Динамическое и постоянное добавление элемента на страницу - Javascript/jQuery

Я работаю над проектом веб-сайта с нуля. Раздел содержимого главной страницы имеет форму и div класса «блог». Когда пользователь входит в учетную запись администратора, появляется форма. Это позволяет вам выбрать заголовок и контент для публикации в блоге. Текущий код работает хорошо, за исключением того, что сообщения удаляются при обновлении страницы. Как я могу постоянно добавлять это на страницу?Динамическое и постоянное добавление элемента на страницу - Javascript/jQuery

Вот мой код:

<script type="text/javascript"> 
function addtext() { 
    var title = document.blogform.title.value; 
    var content = document.blogform.content.value; 

    var $blogTitle = $('<div class="blogtitle">' + title + '</div>'); 
    var $blogContent = $('<div class="blogbody">' + content + '</div>'); 

    $('#blog').prepend($blogContent); 
    $('#blog').prepend($blogTitle); 
} 
</script> 

<h2>Submit New Blog Post</h2> 
<div class="blogtitle">Submit a new blog post:</div> 
<div class="blogbody"> 
    <form name="blogform"> 
    <fieldset class="fieldsetoffset"><legend>Post</legend> 
     <div>Title of Post:</div> 
     <input type="text" name="title"> 
     <div>Content of Post:</div> 
     <textarea name="content" class="comment" rows="6" cols="88"></textarea> 
     <hr> 
     <input type="button" value="Add New Text" onClick="addtext();"> 
    </fieldset> 
    </form> 
</div> 
<div id="blog"></div>

источник

2013-05-08 Nomadic Penguin

Вы используете что-нибудь на бэкэнде? И.Е. ASP.NET, Java, PHP и т. Д. Вам нужно будет сохранить сообщение в базе данных, а затем вытащить данные при загрузке страницы. –

Да, весь мой сайт php, и у меня есть поддержка базы данных/mysql на сервере. Просто не так удобно с этим пользоваться, но я определенно хочу учиться. –

MySQL прост в использовании, и PHP имеет большую поддержку для него. Там должно быть много учебников для вас. Как только вам станет удобно пользоваться БД, вам понравится. Я, кажется, помню, что PHP.net имеет хорошую документацию. Прошло некоторое время с тех пор, как я использовал PHP. –

Вы должны использовать базу данных (или плоские-файлы, но не рекомендуется ..) хранить эти дополнительные части. На своей странице создайте соединение с базой данных (php.net/PDO), извлеките любые существующие записи из базы данных и когда администратор сохранит их, вы должны вставить их в свою базу данных.

HTML является плоским, вы можете добавлять и удалять элементы динамически изменяя DOM, но это только на экране, и никто не ELSES :)

источник

2013-05-08 12:15:04 ChrisH

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

Выяснилось, как это сделать с базой данных, спасибо! –

Ха-ха, рад, что вы поняли, что это стоит проблемы ;-) Это может быть болью в заднице, когда вы впервые начинаете с баз данных, но не забывайте, что вы всегда можете задавать вопросы здесь и в другом месте :) – ChrisH

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

источник

2013-05-08 12:16:47

Это на самом деле все php, кодированной серверной стороной. –

Javascript - это клиентская сторона, то есть когда вы добавляете контент на страницу с помощью jQuery, это локально только для вашего браузера, а не на стороне сервера (на самом деле это не изменение веб-сайта, это просто изменение вашего браузера).

Вам необходимо использовать файлы cookie (есть great jQuery cookies plugin, что невероятно простое в использовании) или, желательно, иметь какой-то серверный скрипт, который хранит его в базе данных и извлекает значения позже, то есть с помощью PHP/mySQL , так как файлы cookie по-прежнему будут для вас конкретными, а не для тех, кто может посетить веб-сайт. Если вы не можете использовать PHP для написания его в текстовом/html-файле на сервере, который затем отображается позже, но это действительно уродливое решение, и база данных действительно там, где вы должны идти сюда.

Я бы, вероятно, использовал функции AJAX jQuery для вызова функции PHP при запуске addtext(), который передает ему значения содержимого и названия для записи в базу данных. Затем добавьте немного PHP-кода на страницу, чтобы проверить базу данных на существующие сообщения и отобразить их.

источник

2013-05-08 12:20:01 Ennui

Вы не можете сделать это Javascript или jQuery, потому что это языки на стороне клиента. Для этого вы должны использовать серверную сторону Language и database

источник

2013-05-08 12:32:45

Динамическое и постоянное добавление элемента на страницу - Javascript/jQuery

ответ

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