“对飞”创建元素ID不jQuery的

工作

<div class='message_top' id='top_7' style='cursor:pointer;'> 
    <div class='top_ime'>From: official</div> 
    <div class='top_status' id='status_7'> 
     <img src='images/message_new.png' height='26' title='New message' /> 
    </div> 
</div>

除此之外，还有很多相同结构的其他的DIV的，但用不同的ID号，例如：

<div class='message_top' id='top_15' style='cursor:pointer;'> 
    <div class='top_ime'>From: official</div> 
    <div class='top_status' id='status_15'> 
     <img src='images/message_new.png' height='26' title='New message' /> 
    </div> 
</div>

现在，我有一个jQuery函数，它接受一个.message_top div的ID和它应该执行使用.top_status DIV属于它的内容的动作。但是，出于某种原因，在语法上，它似乎不能识别.top_status div的ID。我知道我n要解释这很好，但这里有一个小提琴，这将有助于你理解（代码和注释是否有）：

http://jsfiddle.net/gMy2f/1/

$(function() { 
    $('.message_top').click(function(){ 
     var id = this.id; 
     status_id = id.replace("top","status"); 
     status = $("#"+status_id).html(); 
     alert(status_id+" "+status); //status variable is empty, but... 
     status2 = $("#status_7").html(); 
     alert(status2);     //status2 has the expected value 
    }); 
});

所以，你看，如果我叫.html()方法使用$("#status_7").html();它工作正常，但如果我用$("#"+status_id).html();（status_id为“status_7”）调用它不起作用。这里发生了什么事？我多次使用类似的代码，从来没有任何问题。

来源

2013-04-11 jovan

看来，如果你在适当的位置加载你的代码工作正常（提示：在文档准备或负载）

我今天这个刚才已经回答。 http://jsfiddle.net/j08691/gMy2f/4/ – j08691 2013-04-11 15:27:36

@ j08691我刚刚尝试了你的代码，它的失败方式与我的方式一样（至少在Firefox中） - 我很确定我的加载方式是精细。 – jovan 2013-04-11 15:29:03

代码在firefox 19.0.2中工作得很好，也许浏览器兼容性问题？ – gbtimmon 2013-04-11 15:29:11

使用本地变量而不是全局变量。 window.status是预定义的并且是只读的。 Does Javascript/jQuery have system vars?

Updated jsFiddle.

来源

2013-04-11 15:32:39

确实。只需在变量定义前添加'var'即可解决问题。谢谢。 – jovan 2013-04-11 15:34:57

@jovan这可能解释了为什么它在jsfiddle中工作，但不在浏览器中。我相信，但可能是错误的，即jsfiddle将所有javascripts vars放在容器对象中，以将用户代码与页面代码分开，即使它们是全局声明的。 – gbtimmon 2013-04-11 15:36:15

@gbtimmon：Mmh。我不这么认为。小提琴在Firefox中并不适合我（在Firefox中window.status'默认是只读的）。 jsFiddle在iframe中执行代码，但是这对此应该有任何影响。 – 2013-04-11 15:37:56

“对飞”创建元素ID不jQuery的

回答

相关问题