Добавление нового элемента ЗДЕСЬ, где находится код, а не после другого элемента
Сделал некоторый BBCode для phpBB, чтобы пользователи могли публиковать фотографии flickr с определенными тегами. Каждый раздел фотографий в потоке должен быть уникальным, и изображения загружаются при загрузке потока.
Когда дело доходит до уникального DIV, я застрял в поиске способа вставить элемент с уникальным именем в DOM в момент вставки BBCode, А ЗАТЕМ загрузить фотографии. И, похоже, я не могу использовать PHP в BBCode, ни теги шаблонов - если бы я мог легко создать уникальный элемент фотографии из идентификатора записи и тег flickr, над которым я бы смеялся. О, и я не могу прикоснуться к шаблону. Все это должно быть в пределах BBCode. Итак, вот как я создаю уникальный идентификатор:
var flickrUser = "{URL}".split("/")[4];
var tag = "{URL}".split("/")[6];
var photoDIV = flickrUser + "-" + "tag";
Или... чуть выше есть элемент с уникальным идентификатором записи, который я мог бы использовать:
<div id="p61789" class="post bg2">
Я пытался
var postnumber=$(this).closest('div[class^="post"]').attr('id');
Но всегда казалось, что он возвращает ПЕРВЫЙ соответствующий div на странице, а не БЛИЖАЙШИЙ к точке BBCode. Этот элемент находится на два "деления" ниже
<div class = "content">
И под областью публикации пользователя там является:
<div id="sig61789" class="signature">
Итак, где я полностью застрял, это переход к предыдущему() или ближайшему() или родительскому() или вообще в любом месте от точки, где я нахожусь, без ссылки на $(this).
Так что не должно быть что-то вроде:
$(this).prev('content').html('<ul class="thumbs" id=photoDIV></ul>');
Или даже
$(this).html('<ul class="thumbs" id=photoDIV></ul>');
Работа? Каждый раз, когда я думаю, что понимаю jquery, все снова становится туманным...
РЕДАКТИРОВАТЬ: Добавлено больше деталей для Pointy:
<div id="p63167" class="post bg2 online">
<div class="inner">
<span class="corners-top">
<span></span>
</span>
<div class="postbody">
<ul class="profile-icons">
<li class="edit-icon">
<a href="posting.php" title="Edit post">
<span>Edit post</span>
</a>
</li>
<li class="delete-icon">
<a href="posting.php" title="Delete post">
<span>Delete post</span>
</a>
</li>
<li class="report-icon">
<a href="report.php" title="Report this post">
<span>Report this post</span>
</a>
</li>
<li class="info-icon">
<a href="mcp.php" title="Information">
<span>Information</span>
</a>
</li>
<li class="quote-icon">
<a href="posting.php" title="Reply with quote">
<span>Reply with quote</span>
</a>
</li>
</ul>
<h3 class="first">
<a href="#p63167">Re: Testing new bbcode - ignore</a>
</h3>
<p class="author">
<a href="viewtopic.php">
<img src="" alt="Post" title="Post" />
</a>by
<strong>
<a href="memberlist.php">xxx</a>
</strong>» 13 Jun 2011 14:33</p>
<div class="content">
<script>var
APIkey="xxx";head.js("/forum/jflickrfeed/jflickrfeed.min.js","http://jquery-lazy.googlecode.com/svn-history/r14/trunk/jquery.lazy.source.js",function(){var
flickrUser="http://www.flickr.com/photos/xxx/tags/7thjanuary2010/".split("/")[4];var
tag="http://www.flickr.com/photos/xxx/tags/7thjanuary2010/".split("/")[6];var
photoDIV=flickrUser+"-"+"tag";$(this).html('
<ul class="thumbs" id="photoDIV">
</ul>');$.getJSON("http://www.flickr.com/services/rest/?jsoncallback=?",{method:"flickr.urls.lookupUser",url:"http://www.flickr.com/photos/xxx/tags/7thjanuary2010/",format:"json",api_key:APIkey},function(data){$('#cbox').jflickrfeed({limit:30,qstrings:{id:data.user.id,tags:tag},itemTemplate:'
<li>'+'
<a rel="colorbox" href="{{image}}" title="{{title}}">'+'
<img src="{{image_m}}" alt="{{title}}" />'+'</a>'+'</li>'},function(data){$('#cbox
a').colorbox();});});$.lazy([{src:'/forum/jflickrfeed/colorbox/colorbox/jquery.colorbox-min.js',name:'colorbox',dependencies:{css:['/forum/jflickrfeed/jflickrfeed.css','/forum/jflickrfeed/colorbox/example1/colorbox.css']}}]);});</script>
<ul id="cbox" class="thumbs"></ul>
</div>
<div id="sig63167" class="signature"></div>
</div>
</div>
</div>
2 answers
Проблема в том, что вы предполагаете, что контекст this
при выполнении в блоке сценария является самим блоком сценария, что неверно. Если явно не указан контекст, то вашим контекстом является элемент window
DOM. Есть ли какая-либо причина, по которой вы не можете переместить этот код на уровень страницы и инициализировать все записи при загрузке страницы?
$(function() {
$('.post').each(function(i,item) {
console.log(this); //Post DOM element.
//execute your flick retrieval code here.
});
}
Вы пробовали функции DOM Javascript, чтобы добавить его? http://www.javascriptkit.com/javatutors/dom2.shtml
Например, для вставки сразу после текущего скрипта с идентификатором "script1":
document.getElementById("script1").parentNode.appendChild( newelement );
Вы также можете добавить необработанный html, просто установите innerHTML нового элемента.