Autocomplete list from hidden anchors on page
I need to pass 300 or less strings from anchors of tags on page to jquery's:
var availableTags = [
"my tag",
"my tag1"
];
Taglist
Server gives me a taglist only of a certain format were the number of tags is 300 (or less). Every anchor is put in the div. That div has a static class "tagItem":
<div class="tagItem">
<a href="/search/my some first tag/" rel="nofollow" class="eTag eTagGr123">
my tag
</a>
</div>
<div class="tagItem">
<a href="/search/my some first tag/" rel="nofollow" class="eTag eTagGr435">
my tag1
</a>
</div>
What is need to be done is to take the anchor string (my some tag) and put it dynamically into the available tags.
Is it possible at all? An开发者_JS百科d if so, how can it be properly done. Note: I can't make changes to the taglist output format due to the restrictions.
After some testing, here's a complete example:
<html>
<head>
<script src="jquery-1.4.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
var availableTags = [];
$('div.tagItem a').each(function() {
var text = $(this).text();
availableTags.push(text);
});
// at this point, availableTags is:
// ['Tag One', 'Another Tag', 'Tag Three', 'Last Tag']
$('#tags').autocomplete({
source: availableTags
});
});
</script>
</head>
<body>
<div class="tagItem"><a href="/search/tag one">Tag One</a></div>
<div class="tagItem"><a href="/search/tag two/">Another Tag</a></div>
<div class="tagItem"><a href="/search/tag three/">Tag Three</a></div>
<div class="tagItem"><a href="/search/tag four/">Last Tag</a></div>
</body>
</html>
加载中,请稍侯......
精彩评论