我正在编写一个基本的应用程序,涉及更改名称引用的div中的html,并且它在Chrome,Firefox,Safari等中运行良好,但在我们心爱的Internet Explorer中却没有。我正在动态加载内容,所以我不能给你完整的代码,但这里是一个HTML的例子(其中会有很多这样的div与升序数字名称叠加):
<div id="entry" class="entry" name="15">
<div id="comment" class="comment" name="15">Click here...</div>
<div id="rating" class="rating" name="15">24</div>
</div>
这是当用户点击“entry”div时触发的jQuery函数:
$.fn.rateup = function() {
var dname = $(this).attr('name');
var rating = $("div.rating[name="+dname+"]").html();
var newrating = parseInt(rating)+1;
$("div.rating[name="+dname+"]").html(newrating);
}
现在,我想要发生的是点击条目div中的评级div中的HTML增加1,但是在IE中,单击的条目div 的评级增加。我不知道如何在这里选择错误的div,因为它有一个非常具体的名称,在我的代码中非常清楚地引用。我已尝试使用jQuery的.find()方法在单击的条目div中执行相同的操作,并获得相同的结果。我很难过。
点击here查看我在说什么。它可能在其他方面有问题,但这是我目前唯一关注的问题。如果最坏的情况发生,我可以让它选择[name = parseInt(dname)-1]元素,当且仅当在IE中呈现时,我想找到一个不那么hackey的解决方案。
感谢您的想法。
编辑(6/24 11:30 pm)
结合下面的答案以及我新发现的知识,即一些古怪的CSS将东西放在混乱的地方(内联浮动将东西弹出到下一行,除非正确处理),我已经解决了这个问题。感谢大家帮助我成为一名更好的程序员。我会更正确地开始使用属性!
答案 0 :(得分:2)
好吧,我认为你让选择器感到困惑。
<div id="e15" class="entry">
<div class="comment">Click here...</div>
<div class="rating">24</div>
</div>
如果你现在尝试选择评级div,“this.rating”它应该选择正确的。
PS您的姓名字段不是必需的,在xhtml中无效。 (因为它只能是表单字段的成员)
答案 1 :(得分:2)
我不认为DIV元素可以具有name属性,但这是无关紧要的,因为如果你相对于点击的DIV执行所有计算,则不需要...
<div id="entry" class="entry">
<div class="comment">Click here...</div>
<div class="rating">24</div>
</div>
<div id="anotherEntry" class="entry">
<div class="comment">Click here...</div>
<div class="rating">17</div>
</div>
$.fn.rateup = function() {
var ratingElement = $(this).find("div.rating");
var rating = ratingElement.html();
var newrating = parseInt(rating)+1;
ratingElement.html(newrating);
}
这假设每个评级DIV都包含在它自己的条目DIV中,并且每个评级都附加了$ .fn.rateup事件处理程序。
至于选择错误评级的原因,这将取决于哪些元素附加了事件处理程序 - 我们能看到执行此操作的代码吗?
答案 2 :(得分:0)
id在整个页面上应该是唯一的,好像你在使用它们更像是类。也许使用像“1”这样的id作为条目,“c1”和“r1”用于评论和评级将允许更清晰的选择器,从而完全解决问题。你可以做一些像
这样的事情$('#r'+$(this).id).html(newrating)
并没有真正解决你所看到的问题,但是使得html和javascript更加清晰。