如何在不刷新页面的情况下单击菜单栏来更改div内容

Question

<div id="containerright">
  <div id="containerrighttop">
    <ul>
      <li><a  href="C:\Users\Ravi Ranjan\Desktop\new web\New folder/content-  1.     html">Content 1</a></li>
      <li><a  href="C:\Users\Ravi Ranjan\Desktop\new web\New folder/content-2.html">Content 2</a></li>
      <li><a  href="C:\Users\Ravi Ranjan\Desktop\new web\New folder/content-3.html">Content 3</a></li>
    </ul>
  </div>
  <div id="containerrightbottom">
  </div>
</div>
</div>

**这是我用ajax编写的脚本**在这种情况下，我希望菜单栏水平放置，以便在单击该菜单栏时，同一页面的一部分上的div内容在不刷新页面的情况下得到更改

<script type="text/javascript">

    $(function() {

        $("#conatinerright""#containerrighttop").click(function() {

            $("#conatinerright""#containerrightbottom" ).load($(this).attr("href"));

            return false;
        });

    });
</script>

Answer 1

$(function() {
    $("#containerrighttop a").click(function() {
        $("#containerrightbottom").load($(this).attr("href"));
        return false;
    });
});

您的问题是：

1. 您拼错了#containerright 。 由于内部DIV的ID已足够，因此不需要选择器的这一部分。
2. 您使用了无效的语法，方法是将两个不带+字符串彼此相邻以将它们串联在一起。
3. 您将点击处理程序绑定到#containerrighttop ，但应将其绑定到锚点。