Question

在jquery点击事件第一次获得值时，第二次获得空值

JS：

$(".topPanel").live('click', (function(e) {

    form = $(e.target).attr("name");
    content = $("." + form);    
    $(".show_panel1").html("");
    $(".show_panel1").html(content);
    $(".show_panel1").show();

}));

HTML：

 <div class="topPanel"  >
   <span id="5" name="panther" style="background: #990000;" class="span_1">  
                   Panther</span>
   <span id="6" name="lion" style="background: #009900;" class="span_1">
                   Lion</span>         
 </div>

 <div class="show_panel1" >
     <label class="label">welcome</label>
 </div>
 <div class="tiger" >
     <label  class="label">i am panther</label>
 </div>
 <div class="lion" >
     <label  class="label">i am lion</label>
 </div>

CSS

.label
{
    font-family: Verdana; 
    font-size: medium;
    font-weight:lighter; 
    color: #FF990000;
    float:inherit;
    margin:10mm;
}

.topPanel
{
    float: left; 
    color:#000000;
    background: none repeat scroll 0% 0% orange; 
    width: 1280px;
    margin: 10px 5px 5px 10px;
}

.span_1
{
   float: left; 
    height: 40px; 
    width:5%; 
    padding:20px;
    margin: 0px 5px 0px 0px;
}

Answer 1

<强> jsBin demo

$(".topPanel").on('click', 'span', function(){

    var form = $(this).attr("name");
    var content = $("." + form).html();    
    $(".show_panel1").html(content).show();

});

P.S：不确定为什么你需要.show()，但现在就是这样！

Answer 2

这两行没有意义：

content = $("." + form);    
$(".show_panel1").html(content);

content是一个jQuery对象。您不能将jQuery对象放入另一个对象的html中。也许你的意思是：

var content = $("." + form);    
$(".show_panel1").html(content.html());

这将从内容对象获取HTML并将其放入.show_panel1。注意，我还将content变量声明为局部变量，而不是允许它是一个不好的隐式全局变量。

请向我们展示包含class="form"的HTML，以便我们可以看到您在这里尝试做的事情。

此外，.live()已被弃用（您不应再使用它）。将其替换为.on()（对于最新版本的jQuery）或.delegate()（对于旧版本的jQuery）。

Answer 3

看起来这是罪魁祸首

$(".show_panel1").html(content);

您正在将选择器传递给HTML

应该是

$(".show_panel1").html(content.html());

另外<div class="tiger" >

应该是<div class="panther" >

您正在尝试调用不存在的 tiger class

Check this FIDDLE包含所有更新的更改

而在jquery点击事件第一次获得值，但第二次它是空的

3 个答案: