Jquery 不适用于 javascript insideHtml
请查看下面编写的代码。我试图在一页上有多个计时器：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<link rel="stylesheet" href="jquery.countdown.css" media="all" type="text/css" />
<style type="text/css">
#defaultCountdown { width: 240px; height: 40px; }
</style>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery.countdown.js"></script>
<script language="javascript" type="text/javascript">
function LoadText()
{
document.getElementById('dd').innerHTML = '<div id=\"defaultCountdown\" class=\"countdown\" rel=\"87401\">hjhg</div><br/><div id=\"defaultCountdown\" class=\"countdown\" rel=\"60\">hjgj</div><br/><div id=\"defaultCountdown\" class=\"countdown\" rel=\"1800\">hjhg</div><br/>';
}
</script>
</head>
<body>
<div id="dd">
</div>
<script type="text/javascript">
// Initialization
$(document).ready(function()
{
var date = new Date();
$('div.#defaultCountdown').each(function()
{
$(this).countdown
({
until:parseInt($(this).attr("rel"),10),
format:"DHMS",
expiryText:"Expired"
})
})
});
</script>
</body>
</html>
当我创建 Divs 硬编码时，我的代码工作正常。但是当我通过 Ajax 加载它时（为了理解代码，暂时我使用 Function LoadText() 创建 Divs），我无法显示它。请帮帮我。
Please have a look on code written below. I am trying to have a multiple timer on one page:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<link rel="stylesheet" href="jquery.countdown.css" media="all" type="text/css" />
<style type="text/css">
#defaultCountdown { width: 240px; height: 40px; }
</style>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery.countdown.js"></script>
<script language="javascript" type="text/javascript">
function LoadText()
{
document.getElementById('dd').innerHTML = '<div id=\"defaultCountdown\" class=\"countdown\" rel=\"87401\">hjhg</div><br/><div id=\"defaultCountdown\" class=\"countdown\" rel=\"60\">hjgj</div><br/><div id=\"defaultCountdown\" class=\"countdown\" rel=\"1800\">hjhg</div><br/>';
}
</script>
</head>
<body>
<div id="dd">
</div>
<script type="text/javascript">
// Initialization
$(document).ready(function()
{
var date = new Date();
$('div.#defaultCountdown').each(function()
{
$(this).countdown
({
until:parseInt($(this).attr("rel"),10),
format:"DHMS",
expiryText:"Expired"
})
})
});
</script>
</body>
</html>
My code works fine when I create Divs Hardcoded. But when I load it through Ajax (For understanding of code, for the time being I am creating Divs using Function LoadText()), I am not able to get it displayed. Please help me out.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（6）
其一，你有这个：
应该是：
For one, you have this:
which should be:
您应该为 #defaultCountdown div 使用类或唯一 ID。
另外，这也会使选择器引擎感到困惑，因为您告诉它寻找带有 # 符号的类：
尝试将其更改为类并使用：
更新：好的，您的代码无法正常工作的原因是因为 < code>LoadText() 函数永远不会被调用。如果您将脚本更新为如下所示，它将起作用（演示）：
You should be using a class or unique IDs for the #defaultCountdown div.
Also this would confuse the selector engine since you are telling it to look for a class with a # sign in it:
Try changing it to a class and use:
Update: Ok, the reason why your code isn't working is because the
LoadText()function is never called. If you update your script to look like this, it will work (demo):听起来像是一个时间问题。您的 jQuery 代码在数据呈现到页面时运行，而不是在 ajax 查询完成后运行。使其成为一个函数，而不是准备好运行的东西，并在 ajax 完成后调用它。
sounds like a timing issue. your jQuery code runs when the data is rendered to the page not after your ajax query completes. Make that a function rather than something to run on ready and call it after the ajax finishes.
当文档准备好时，您的 $('div.#defaultCountdown').each(function() 循环运行一次 - 如果您随后使用 Ajax 添加新的 div，那么您需要确保重新运行 $('div.#现在添加了新的 div，defaultCountdown').each(function() 再次编码。jQuery
live() 函数对此很有用。
Your $('div.#defaultCountdown').each(function() loop runs once when the document is ready - if you subsequently add new divs using Ajax then you need to make sure you re-run your $('div.#defaultCountdown').each(function() code again now that new divs have been added.
The jQuery live() function is good for this.
如果我不使用 Ajax Response Text 或 JavaScript insideHTML，则工作代码。此方向的任何解决方案都将受到赞赏。请在下面找到正在运行的修改后的代码。在此代码中，我创建了硬编码的 div。可以通过复制此代码并将其保存到 html 文件来测试这两个代码。
The working Code if I am not using Ajax Response Text or JavaScript innerHTML. Any solution in this direction will be appriciated. Please find below the modified code that is working. In this code I have created the divs hardcoded. Both the codes can be tested by copying this codes and saving it to html file.