在按钮上加载页面使用Jquery单击特定div区域

时间:2013-07-05 17:23:01

标签: jquery html

我正在尝试使用AJAX和jQuery在按钮点击时在<div id="content"></div>中加载HTML文件但是点击没有加载它。以下是代码:

<body>    
<div id="header">    
<div id="radio">
  <input type="radio" id="navmenu1" name="radio"><label for="navmenu1">Home</label>
  <input type="radio" id="navmenu2" name="radio"><label for="navmenu2">Contact</label>
  <input type="radio" id="navmenu3" name="radio"><label for="navmenu3">Resume</label>
</div>
<div id="social">
    <a href="https://www.facebook.com/han.chang.10" target="new"><img src="img/facebook.png" class="facebook" alt="Facebook" /></a>
    <a href="http://www.linkedin.com/pub/han-chang/58/959/a74/"><img src="img/linkedin.png" class="linkedin" alt="linkedin" /></a>
    <a href="http://www.linkedin.com/pub/han-chang/58/959/a74/"><img src="img/twitter.png" class="twitter" alt="twitter" /></a>
    <a href="mailto:shuhanchang612@gmail.com"><img src="img/gmail.png" class="gmail" alt="gmail" /></a>
</div> 
</div><!--head-->

<div id="content-area">
    <div id="content"></div>    
</div>

<div id="footer-row">
   <footer>
      <div id="footer-row-1">
        <ul id="footer">
            <li>&copy 2013</li>
        </ul>
      </div>
   </footer>
</div> 
</body>

home.js如下:

$(function(){
    $("#radio").buttonset({
    $("#content").load("Page1.cshtml");
});
})

1 个答案:

答案 0 :(得分:0)

你有几个问题。

首先,你的jQuery无效。为什么$("#content).load("Page1.csthml");在javascript对象中间自行挂出?

Javascript对象,或者至少作为选项传递的对象,通常具有以下格式:

{
    property1 : "value1",
    property2 : "value2
}

您的“对象”只有属性或值,但不是两者。我想你正在寻找这个:

$(function () {
    $("#radio").buttonset();

    $("#radio").click(function() {
        $("#content).load("Page1.csthml");
    });
})

但是,您还有一个问题:您无法直接调用.cshtml文件,您需要调用使用.cshtml作为视图的控制器操作。