#jquery
#jquery
Вопрос:
это вопрос новичка, поэтому, будьте великодушны со мной, пожалуйста.
Возьмем, к примеру, Twitter. Вверху есть текстовая форма ввода для написания твита, а под списком твитов. Если вы напишете новый твит и нажмете кнопку «Tweet», вы мгновенно увидите свой новый твит в списке твитов, без перезагрузки страницы. Я знаю, что это банальная ситуация, но, кстати, я хочу спросить вас.
У меня есть страница с формой вверху, а под ней список сообщений. Когда вы заполняете форму и отправляете новое сообщение, страница перезагружается, и вы видите обновленный список сообщений с новым сообщением. Я хочу реализовать ту же технику, что и Twitter. Может быть, мне следует использовать jQuery и отправлять данные на страницу с помощью $.post . Можете ли вы объяснить мне кое-что о?
Комментарии:
1. Можете ли вы опубликовать свою наценку? Или опубликовать что-нибудь на JS Fiddle , чтобы продемонстрировать свое использование?
2. Да, используйте jQuery и
$.post(). Если вы не можете заставить это работать, вернитесь сюда с кодом, который вы пробовали, и я уверен, что кто-нибудь поможет вам его отладить. api.jquery.com/jQuery.post для справки.3. @David У меня нет разметки, у меня есть простая форма, которая вставляет сообщение в базу данных, а под ним показывает список сообщений. Очень просто. Но после каждой отправки страница перезагружается. Я не хочу перезагружать, но я хочу, чтобы список сообщений обновлялся мгновенно после отправки.
4. @dosboy спасибо. Теперь я перейду к изучению нескольких примеров о jQuery post. Если у меня возникнут проблемы, я вернусь сюда. Вы очень добрый человек.
Ответ №1:
Поскольку вы новичок, я думаю, что самым простым способом будет тот, который я опишу. Если у вас есть этот div (где вы хотите, чтобы отображался новый канал):
Разметка:
<div id="feeds">
<div class="feed"> Feed 1</div>
<div class="feed"> Feed 2</div>
<!-- Your new feed will appear here -->
</div>
Javascript:
$("div.feed:last").clone().appendTo("#feeds").load("newfeed.php?param1=val1");
Сервер (использующий php):
<? //newfeed.php
$param1 = $_GET['param1'];
$content = "Here put your latest feed";
echo $content;
?>
И это все.
Теперь я объясню, что мы делаем в этой строке javascript
$("div.feed:last") //Select the last div with class "feed"
.clone() //We clone it, to make space for the new feed
.appendTo("#feeds") //We add the clone to the final of the feed list
.load("newfeed.php?param1=val1"); //Load it's content with a value got from server
Когда вы почувствуете себя более комфортно с jquery, используйте вместо этого $.ajax.
Надеюсь, это поможет, приветствия
Комментарии:
1. большое вам спасибо. Практический пример всегда очень полезен.
Ответ №2:
Фред ,
вы можете использовать jquery ajax для того же ,
после успешного выполнения ajax обновите свой DOM html