在同一页面加载内容ajax

-1

我有一个页面的网站结构。这是我的菜单：在同一页面加载内容ajax

我有一个菜单结构：

<ul id="creamenu" class="menuHolder"> 
         <li><a id="news-1-menu" href="#/creative-events">news 1</a></li> 
         <li><a id="news-2-menu" href="#/creative-ajans">news 2</a></li> 
         <li><a id="news-3-menu" href="#/incentive-travel">news 3</a></li> 
        </ul> 
        <ul id="mainmenu" class="menuHolder"> 
         <li><a id="about1-menu" href="#/hakkimizda">about 1</a></li> 
         <li><a id="about2-menu" href="#/haberler">about 2</a></li> 
         <li><a id="about3-menu" href="#/galeri">about 3</a></li> 
         <li><a id="about4-menu" href="#/referanslar">about 4</a></li> 
         <li><a id="about5-menu" href="#/iletisim">about 5</a></li> 
    </ul>

这是内容结构：

<div id='news-1'> 
    <!-- content --> 
    <!-- content -->

<div id='news-2'> 
    <!-- content --> 
    <!-- content -->

当我点击菜单项，请转到第vi页一个视差效果（我正在使用高级插件）但是我的网站是慢慢的...因为，我希望当我点击一个菜单项时，通过ajax加载内容。可能吗？我该怎么做？

来源

2013-01-22 Dokuz Tane On

如果内容是在其他文件，然后你可以用$.load(url).

$('#news-1').load('url of the content to load');

做，如果你存储同一页面的内容，那么你可以把它当看到菜单点击。

$('#news-1').on('click',function(){ 
$('#news-1').appendTo($('#creative-events').html()); // this is the prototype, need to make a generic code 
})

来源

2013-01-22 11:58:51

没有在同一页上的所有内容。 –

''，如果您将内容存储在同一页面中，则可以在单击菜单时使其可见。''但如何？ –

我不知道为什么，但此代码不工作Ravi。其他的解决方案？ –

试试这个

$('#news-1').load('ajax/page1.html'); 
$('#news-2').load('ajax/page2.html');

来源

2013-01-22 12:00:11 YogeshWaran

同一页面中的所有内容。所以，不要这样做。 –

试试这个： -

$('ul#creamenu li a').click(function() { 
$.ajax({ 
       type: "POST", 
       url: "Your Url", 
       data: "{'data':'send data here if you want'}", 
       dataType: "json", 
       success: function (data) { 
        alert(JSON.Stringify(data)); 
       }, 
       error: function (result) { 
        alert("Error"); 
       } 
      }); 

});

来源

2013-01-22 12:00:50

同一页面中的所有内容。所以，不要这样做。 –

我觉得你正在寻找像标签面板的解决方案。尝试隐藏和显示div使用jQuery .. 例如。 u有3个菜单新闻-1，新闻2，新闻3，使他们的独立内容的div例如：DIV1，DIV2，DIV3喜欢如下...

<div id="div1" style="display:none"> 
some content.... 
</div> 
<div id="div2" style="display:none"> 
some content.... 
</div> 
<div id="div3" style="display:none"> 
some content.... 
</div>

在为前菜单的onclick事件。新闻-1，则表明DIV1，让隐藏所有其他如下..

$("#div2").hide(); 
$("#div3").hide(); 
$("#div1").show();

然后更改代码其它菜单以及..

来源

2013-01-22 12:59:28 Ram

我不明白，请帮助我。 –

你说过所有与所有菜单相关的内容都在同一页。是对的吗？ – Ram

在同一页面加载内容ajax

回答

相关问题