jQuery单击功能未加载新内容 [英] Jquery click function not loading new content
问题描述
由于某种原因，jquery不会将新的html加载到#textoPequeno div中. 实际上，它会尽可能地删除旧内容.
For some reason jquery does not load the new html into the #textoPequeno div. It actually removes the old content, that as far as it gets.
以下是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.7.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="test.html">Home</a></li>
<li><a href="test">Home</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Home</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>
还有jquery代码
$("li a").live("click", function(){
$("#textoPequeno").load($(this).attr('href')+' .main');
return false;
});
请检查实时示例: http://gabrielmeono.com/working/
如果我从javascript代码中删除了main，则该页面不会在div内加载.它将保持原样.
If I remove the main from the javascript code, the page will not load inside the div. It will remain as it is.
推荐答案
您的代码很好，您的html错误.
Your code is fine, your html is wrong.
您似乎正在尝试创建独立的页面，这些页面也具有通过ajax加载的功能.
It looks like you're trying to create stand alone pages that also has the capabilities of being loaded through ajax.
您要将' .main'附加到.load()调用中，这等效于从返回的内容中选择'.main'.如果这样做的话，那么所有的html页面都需要包含一个带有class='main'的元素.
You are appending ' .main' to your .load() call, which is equivalent to selecting '.main' from the returned content. If you are doing that, all your html pages need to have an element with class='main' in it.
我的建议是使用id='main'代替类.然后将您的呼叫更改为:$("#textoPequeno").load($(this).attr('href')+' #main');
My suggestion would be to use id='main' instead of a class. Then change your call to: $("#textoPequeno").load($(this).attr('href')+' #main');
这篇关于jQuery单击功能未加载新内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
