如何通过单击菜单中的Li将html页面从href加载到div中？

Question

我有一个ul菜单

                   <ul>
                      <li>
                        <a href="../folder/rules.html" id="rules">rules</a>
                    </li>
                    <li>
                        <a href="../folder/service.html" id="service">Service</a>
                    </li>
                    </ul>

我希望当用户按下标签时，我在本页底部的<div id=result>加载html页面。

我尝试使用jquery，因为我发现但href在新标签上的href加载有我的代码：

  <script src="http://code.jquery.com/jquery-1.4.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(document).ready(funtction(){
        $("#rules").click(function()
             $('#result').load(rules.html);
        });
        $("#service").click(function(){
            $('#result').load(service.html);
        })
    });
     </script>

Answer 1

阅读.load() | jQuery API Documentation

您需要将HTML文件的路径传递为string。

替换

$('#result').load(rules.html);

与

$('#result').load('../folder/rules.html');

修改

在回复您的评论时，请尝试以下操作：

$("#rules").click(function(event)
     $('#result').load('../folder/rules.html');
     event.preventDefault(); // so that the event does not bubble up
});