Как отобразить, извлеченные данные из API, на html-странице? - PullRequest
0 голосов
/ 19 августа 2010

У меня есть HTML-страница.Здесь я использую вкладку Yahoo API.То есть:

<div id="demo" class="yui-navset">
    <ul class="yui-nav">
        <li class="selected"><a href="#tab1" onclick="TopStories()"><em>Top Stories</em></a></li>
        <li><a href="#tab2" onclick="FinanceNews()"><em>Finance</em></a></li>
        <li><a href="#tab3" onclick="SportsNews()"><em>Sports</em></a></li>
    </ul>            
    <div class="yui-content">
        <div><p>Top Stories</p></div>
        <div><p>Finance</p></div>
        <div><p>Sports</p></div>
    </div>
</div>

В onClickEvent используемые функции извлекают данные из Google NEWS>

function TopStories(){
location.href="http://www.google.com/news/search?aq=f&pz=1&cf=all&ned=in&hl=en&q=TopStories";
}
function FinanceNews(){
location.href="http://www.google.com/news/search?aq=f&pz=1&cf=all&ned=in&hl=en&q=Finance";
}
function SportsNews(){
location.href="http://www.google.com/news/search?aq=f&pz=1&cf=all&ned=in&hl=en&q=Sports";
}

Но выводом является переход к странице NEWS.Но я хочу отобразить их как вкладку.

Что мне делать?

1 Ответ

0 голосов
/ 19 августа 2010

Вы можете использовать iframe для этой цели .. см. Пример ниже,

Используя вкладку Jquery, всегда создайте div, где отображается ваш результат.У вас есть только способ открыть внешнюю ссылку на вашей странице, используя.

<li><a href=ReturnIfram()><span>Google</span></a></li>

href получить строку, содержащую ифрам, такой как

public string ReturnIfram()
{
   return "<iframe src="http://google.fr"></iframe>"
}

, попробуйте выше в javascript, см. Пример ниже

<html>
<head>
<script language="JavaScript" type="text/javascript">
function makeFrame() {
   ifrm = document.createElement("IFRAME");
   ifrm.setAttribute("src", "http://developerfusion.com/");
   ifrm.style.width = 640+"px";
   ifrm.style.height = 480+"px";
   document.body.appendChild(ifrm);
}
</script>
</head>
<body>
<p><a href="#" onMouseDown="makeFrame()">GO! </a></p>
</body>
</html> 
...