点击jQuery的功能arent点击

$(document).ready(function() { 
     $('.poga').css('cursor','pointer'); 

     $("#poga1").click(function() { 
     var n= "poga1"; 
     alert ("pēc piereģistrē " + n); 
     }); 
     $("#poga2").click(function() { 

     var n= "poga2"; 
     alert ("pēc piereģistrē " + n); 
     }); 

     $(".poga").click(function(){ 
     $(".poga").animate({borderBottomWidth:'1'}); 
     $(this).animate({borderBottomWidth:'0'}); 
     alert ("n ir vienāds ar " + n); 
     switch(n) 
    { 
    case poga1: 
     $("#ChangeContent").html("Pirmā poga nospiesta."); 
     break; 
    case poga2: 
    $("#ChangeContent").html("Otrā poga nospiesta."); 
     break; 
    default: 
     $("#ChangeContent").html("Trešā vai ceturtā poga nospiesta."); 
    } 

    return false; 
}); 

});

所以，我有这个JavaScript功能，应该按下按钮后动态更改文本。 “poga”是指我的语言中的按钮。由于我是jquery的初学者，我试图保持简单。点击jQuery的功能arent点击

$("#poga1").click(function() { 
    var n= "poga1"; 
    alert ("pēc piereģistrē " + n); 
    }); 
    $("#poga2").click(function() { 

    var n= "poga2"; 
    alert ("pēc piereģistrē " + n); 
    });

当点击按钮1，使n个相等的 “poga1”，按钮2被点击时，使n个相等的 “poga2”

$(".poga").click(function(){ 
    $(".poga").animate({borderBottomWidth:'1'}); 
    $(this).animate({borderBottomWidth:'0'}); 
    alert ("n ir vienāds ar " + n); 
    switch(n) 
{ 
case poga1: 
    $("#ChangeContent").html("Pirmā poga nospiesta."); 
    break; 
case poga2: 
$("#ChangeContent").html("Otrā poga nospiesta."); 
    break; 
default: 
    $("#ChangeContent").html("Trešā vai ceturtā poga nospiesta."); 
}

当任一按钮被点击（所有的按钮有这个类），动画一点点，并改变名为“ChangeContent”的div的内容。

出于某种原因，我甚至没有得到最后一个函数的警报，虽然之前我添加了前两个函数，注册n，最后一个函数工作。

我的问题是为什么当我点击一个特定的类应该工作的最后一个函数不起作用？

来源

2014-01-07 Reinis

如果你有一个提示你正在做什么（标记以及JavaScript）的小提琴，它将更容易调试。 – jameslafferty

继承人小提琴 - http://jsfiddle.net/j6ULQ/1/ – Reinis

您面临的问题是与变量范围有关。您在点击函数中声明了n，所以它们不存在于它们之外。看看这个代码...

var n; 

$(document).ready(function() { 
    $('.poga').css('cursor','pointer'); 

    $("#poga1").click(function() { 
     n = "poga1"; 
     alert ("pec pieregistre " + n); 
    }); 

    $("#poga2").click(function() { 
     n = "poga2"; 
     alert ("pec pieregistre " + n); 
    }); 

    $(".poga").click(function(){ 
     $(".poga").animate({borderBottomWidth:'1'}); 
     $(this).animate({borderBottomWidth:'0'}); 
     alert ("n ir vienads ar " + n); 
     switch(n) 
     { 
      case "poga1": 
       $("#ChangeContent").html("Pirma poga nospiesta."); 
       break; 
      case "poga2": 
       $("#ChangeContent").html("Otra poga nospiesta."); 
       break; 
      default: 
       $("#ChangeContent").html("Treša vai ceturta poga nospiesta."); 
     } 
     return false; 
    }); 
});

在这方面，n声明的点击功能之外，这样你就可以将值分配给它，它会在其他功能依然存在。

编辑：

我在这里更新您的jsfiddle例如...

http://jsfiddle.net/j6ULQ/2/

来源

2014-01-07 16:50:54 Archer

啊，我没有注意到！我认为这个加上我的答案的组合会让你在那里（我指出的是在代码示例中，但不是在文本中） –

您可以将'''var n''移动到ready函数中并避免污染全球范围。 – jameslafferty

我确实发现了自己，但没有提及它。它在我上面的代码和更新的jsfiddle中修复。 – Archer

在你的case语句，你是对的变量命名poga1和poga2值测试而不是字符串值。在值的周围加上引号，这样你就可以拥有

switch(n) 
{ 
case 'poga1': 
    $("#ChangeContent").html("Pirmā poga nospiesta."); 
    break; 
case 'poga2': 
$("#ChangeContent").html("Otrā poga nospiesta."); 
    break; 
default: 
    $("#ChangeContent").html("Trešā vai ceturtā poga nospiesta."); 
}

来源

2014-01-07 16:56:46

点击jQuery的功能arent点击

回答

相关问题