HTML+CSS+JavaScript

Всем Добрый День Уважаемые коллеги!!! В общем проблема такая: у меня есть список постов, которые образованы списком из Дивов. В каждом Диве понятное дело есть параграфы. В общем как сделать так что бы привязать все эти посты к одной ф-ии удаления , я уже понял. Но вот незадача, после удаления со страницы с помощью Аякса я также удаляю пост из БД. Но что бы что то удалять надо знать что, понятное дело удалять надо по ID поста. Но я не могу решить где его хранить на странице. ID объекта может начинаться только с латинской буквы, конечно его можно с начало присваивать, а потом разделять. Ещё можно печатать этот ID, а потом обратно его брать, но так по моему тоже никто не делать. Я уж подумал о том что-бы печатать этот ID тем же цветом что и фон поста, тогда его не будет видно, а по факту он будет. Конечно, в каждом диве будет либо кнопка, либо параграф с названием удалить, но сути проблемы это не меняет. В общем если у вас есть опыт в этом вопросе, посоветуйте что нибудь пожалуйста.

Через какое-то время ещё пришла в голову идея, печатать ID сообщения в этих постах, но с свойством CSS display : none; Благо все равно можно будет прочитать в JS айдишник, но все равно жду ваших советов, уважаемые коллеги.

С уважением к вам и вашему труду HK416!!!

Боже мой какие муки? Если вам надо только поучать эти id, не обращаясь по ним к объекту, да прописывайте спокойно только цифры, уж поверьте, JavaScript от этого сума не сойдет.
Если же еще и обращение по ним, ну так пишите:
post-122
а при отправке ajax, достаточно obj.id.peplace('-','=') и будет готова строка параметра для запроса, на сервер уйдет переменная "post" со значением 122.

альтернативой решению предложенному confirm - вы можете использовать атрибуты data-* для хранения нужных данных

<div data-id="888">...</div>

Ох парни, спасибо большое за информацию, но голову я уже сломал походу. В общем тут такая проблема, что Айдишник Дива мне все таки нужен один и тот же так как я буду пользовать вот этот код, что бы привязать эту ф-ю ко всем дивам c id="post"

window.onload=function(); { var post = document.detElementById('post'); for(var i=0; i<post.lenght; i++) post.onclick=delete_post; }

По этому к сожалению вариант с разными Айдишниками дива отметается, с другой стороны можно айдишник запомнить в атрибуте class раз id занят. Жалко что по одному классу нельзя так же сделать var post = document.detElementById('post'); Или как то ещё можно привязать одно событие сразу к несколькими дивам?

[i]Автор: AlexSol (27.07.2012 в 18:50)
альтернативой решению предложенному confirm - вы можете использовать атрибуты data-* для хранения нужных данных

<div data-id="888">...</div>

По поводу <div data-id="888">...</div>, извиняюсь конечно, я просто не разу не водной документации не видел этот атрибут, а как к нему если что обращаться? И вообще где можно найти описание этого аттрибута, это часом не он ? http://www.w3.org/TR/html401/struct/objects.html#adef-data

С уважением к вам парни!!!!

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

А если сделать вот так: у дивов-Постов будут разные ID как раз по базе, стили мы им присвоим по атрибуту class, а удалять будем как и планировалось, через параграф с надписью удалить, и функцию удаления как раз завяжем на эту надпись, по одинаковым айдишникам. А когда функция начнет работать мы через this и paretnode доберемся до родительского айдишника удалим весь пост. Нормальная идея как считаете? В общем, ясен пень система такая в ЛС в VK реализована, только если бы я знал как она там была написана, я бы никого бы не беспокоил.

И ещё 2 вопроса. То есть можно произвольные атрибуты с данными создавать у элементов? А по поводу выборки Дивов, в Jquery как я понимаю эти фильтры по атрибутам есть. Но конечно хотелось бы без него обойтись.

Насчет вопросов:
а) вы можете создавать у тегов свои атрибуты;
б) вы можете получать значения своих атрибутов не только с помощью jQuery, но просто JavaScript, так как первая это не собственный язык, а библиотека написанная на втором, а значит использует методы именно его, а не чего-то иного.

Причем туи стили, когда речь идет об удалении? Я понятия не имею, как ваши посты прописаны на странице, кто там кому является родителем... Знал бы код, мог бы что-то сказать, а как просто можно получить все, что вам надо, я уже написал.

Вот примерный код того куска который нужен, если в нём ошибки

<html> <head> <script type="text/javascript"> window.onload=function()  {  var del = document.detElementById('del');  for(var i=0; i<del.lenght; i++) del.onclick=delete_post;  }  delete_post() { id=this.parentNode.getAttribute("id"); var max = document.getElementById('id');     if(max!=null)         max.parentNode.removeChild(max); } </script> </head> <body> <div id="content"> <div id="1" class="post"> <p> Содержимое поста 1</p> <p id="del"> Удалить пост </p> </div> <div id="2" class="post">  <p> Содержимое поста 2</p> <p id="del"> Удалить пост </p> </div> . . . . . . . . . . <div id="100" class="post">  <p> Содержимое поста 100</p> <p id="del"> Удалить пост </p> </div> </div> </body> </html>

<html>  <head>  <script type="text/javascript">  function delete_post(e) {     if(e.tagName=='SPAN') {       alert('For Ajax del='+e.id);       e.parentNode.parentNode.removeChild(document.getElementById('post-'+e.id));     } }  </script>  </head>  <body>  <div id="content" onclick="delete_post(event.target || event.srcElement)">   <div id="post-1" class="post">    <p>Содержимое поста 1</p>    <span id="1">Удалить пост</span>   </div>   <div id="post-2" class="post">   <p> Содержимое поста 2</p>    <span id="2">Удалить пост</span>   </div>   <div id="post-3" class="post">   <p> Содержимое поста 3</p>    <span id="3">Удалить пост</span>   </div>  </div>  </body>  </html>

ЭЭЭЭЭЭ Спасибо конечно, но можно было и чуть по проще код написать ))))

Оставьте только это:

<html> </html>

будет совсем просто.

Шутку понял смешно, можно было и мой вариант поправить, тем более простота залог надежности ))) Или вы думаете я не знаю, что вы объект Event решили использовать.

Ваш вариант глуп, уже в части "навешивания" событий, и править подобное нет желания. Не нравится то, что я вам предложил, правьте свое сами.

все спасибо, я написал свой код, который проще и который отлично работает, спасибо за помощь :-)