使用JavaScript和XML进行搜索

时间:2015-06-19 10:48:53

标签: javascript ajax xml search livesearch

所以我有这个xml文件,例如:

<?xml version="1.0" encoding="UTF-8" ?>
<rss version="2.0" xmlns:g="http://base.google.com/ns/1.0" xmlns:c="http://base.google.com/cns/1.0">
<channel>
    <title>Shop</title>
    <link>http://domain.com/shop</link>
    <description>some text</description>
    <item>
        <title>Entry title 1</title>
        <description>Some description 1</description>
        <g:image_link>http://domain.com/1.jpg</g:image_link>
        <link>http://domain.com/shop/entry1</link>
    </item>
    <item>
        <title>Entry title 2</title>
        <description>Some description 2</description>
        <g:image_link>http://domain.com/2.jpg</g:image_link>
        <link>http://domain.com/shop/entry2</link>
    </item>

所以我喜欢做的事情是在其中添加带有搜索表单的html,然后根据搜索词显示同一页面中的所有结果(例如,创建新的或空的div)术语

这可能吗?

这是我的搜索方式:

<div class="searchForm">
<form onsubmit="this.sfSbm.disabled=true" method="post" action="/shop/search">
<input name="query" placeholder="Search" type="text" >
<input class="searchSbmFl" name="sfSbm" value="Find" type="submit">
</form>
</div>

我希望得到这样的代码或类似的东西:

<div class="searchForm">
<form onsubmit="this.sfSbm.disabled=true" method="post" action="/shop/search"><input name="query" placeholder="Search" type="text">
<input class="searchSbmFl" name="sfSbm" value="Find" type="submit">
</form>
<ul id="search-results">
<li class="clr">
<a href="http://domain.com/shop/entry1">
<img src="http://domain.com/1.jpg" class="s-img">
<p>Entry title 1</p>
</a>
</li>
<li class="clr">
<a href="http://domain.com/shop/entry2">
<img src="http://domain.com/2.jpg" class="s-img">
<p>Entry title 2</p>
</a>
</li>
</div>
</div>

看起来像这样:

enter image description here

非常感谢任何可以帮助我的人!

0 个答案:

没有答案