Question

我有两个名为“personal_info”和“portfolio”的php页面。我通过codeigniter http://www.mysite.com/controller/personal_info和http://www.mysite.com/controller/portfolio中的php函数加载它们。

我有一个页面，菜单标签链接到personal_info和投资组合，我想在点击标签时通过ajax加载页面。如果在浏览器中关闭了js，则选项卡应该只是转到URL。

我正在使用jquery .load()函数来加载页面。

<script type="text/javascript">     
$(document).ready(function(){
    $('#personal_info').click(function() {
        $('#result').load('personal_info #load'); //load fragments from #load div
    }); 

    $('#portfolio').click(function() {
        $('#result').load('portfolio #load');
    });         
});
</script>

HTML

<div id="tab"><a href="http://www.site.com/portfolio/edit/general_info" id="general_info">General Info</a></div>

<div id="tab"><a href="http://www.site.com/portfolio/edit/portfolio" id="portfolio">Portfolio</a></div>

<div id="result"></div>

问题：当我点击标签时，它会将其视为链接并转到URL，而不是通过jquery加载页面。如果启用了javascript，如何禁用该链接？另外，我注意到javascript没有从页面中的片段加载，如果我把javascript放在页面中，我加载数据就不会把它拿起来。

对此有什么好处？

编辑：

为了加载js，我只是将整个页面包装在result div中，并使用js和页眉，页脚加载其他页面。

Answer 1

对于第一个问题：将return false;放在每个“点击”功能的末尾：

$('#personal_info').click(function() {
    $('#result').load('personal_info');
    return false;
});

编辑：对于第二个问题，可能会拔出任何jquery / javascript并从中央application.js文件运行它？

Answer 2

您需要阻止<a/>元素的默认操作。您可以使用event.preventDefault()

完成此操作

$('#personal_info').click(function(e) {
    $('#result').load('personal_info');
    e.preventDefault();
}); 

$('#portfolio').click(function(e) {
    $('#result').load('portfolio');
    e.preventDefault();
});

Answer 3

要停止发生默认操作（在链接之后），您需要在jQuery click（）函数结束时使用return false。

关于你的第二个问题（“javascript未从[动态加载]页面加载”），请确保使用jQuery的.live功能来附加处理程序。

Jquery从URL加载数据或转到URL

3 个答案: