Question

我想用外部文件替换#textoGrande div的内容。

我打算使用每个菜单li调用包含的div文件，避免重新加载页面。我的javascript包含空...我不知道如何开始......

这是html结构：

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<link href="css/style.css" media="screen" rel="stylesheet" type="text/css">
 <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
<script type='text/javascript' src='include/javascript.js'></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Opera</title>
</head>

<body>
    <div class="main">
        <div id="header">

            <h1 id="logo">
                <a href="#">Linux Logo</a>
            </h1>

            <ul>
                <li><a href="#">Home</a></li>
                <li><a href="#">News</a></li>
                <li><a href="#">About</a></li>
                <li><a href="#">Contact</a></li>
                <li><a href="#">Support</a></li>
            </ul>

            <div id="player"></div>

        </div>
    <div id="imagen"></div>
    <h2 id="textoGrande"><p>Opera ahora<br /> mas acojedor...</p>
    </h2><h3 id="textoPequeno"><p>En su nueva versión, Opera apuesta por un nuevo diseño y pestañas visuales, un motor más veloz que incrementa su velocidad en un 40% frente a su anterior versión y un mejor soporte de estándares.</p>

    </h3></div>


</body></html>

Answer 1

$("li a").live("click", function(){
       $("#textoGrande").load($(this).attr('href')+' body');    
       return false;
});

Answer 2

$(document).ready(function() {
  $("li a").click(function() {
    $("#textoGrande").load($(this).attr('href'));
  });
});

Jquery在单击时替换内容

2 个答案: