0

我想在单击图标时更改 z-index - 每次用户单击 index-z 为 +1 的图标时，但我的代码不起作用：

  $(document).on('click', '.icon-layer-up', function() { 
      console.log($(this).parent(".ui-wrapper").css("z-index"));
      var currentIndex = $(this).parent(".ui-wrapper").css("z-index"); 
      if ( currentIndex = "auto" ) {
        currentIndex = 0;
      }
      var num = currentIndex++;
       $(this).parent(".ui-wrapper").css("z-index", num );
    });
4

3 回答 3

2

之间有很大区别

if( currentIndex = "auto" ) {

和

if( currentIndex == "auto") {

第一个执行您不想要的赋值，始终返回“auto”作为结果，并且 if 语句始终运行，将 currentIndex 重置为 0。

404 也是正确的，你不想在这种情况下使用“num++”，原因有两个

  1. 它仅在分配后尝试增加值，这无论如何都会给你一个不正确的值，但是......
  2. 在您的情况下，“num”实际上是一个字符串，因为它是如何获取的。您需要将其转换为数字才能进行加法：parseInt(num) + 1
于 2013-10-17T01:35:28.283 回答
1

你的问题是var num = currentIndex++;。

currentIndex++将递增currentIndex到currentIndex + 1，但它会返回原始值，因此num被分配给 的原始值currentIndex。只需使用var num = currentIndex + 1.

如果您只想添加 1，则使用这不是很好的编码实践++。如果您只是添加，请使用+ 1.

于 2013-10-17T01:33:01.040 回答
1

我注意到您的代码的第一件事（可能是也可能不是问题）是您缺少 jQueryon事件的数据参数。您还将希望将您的事件应用于document.body而不是document.

$(document.body/*changed*/).on('click', '.icon-layer-up', {}/*added*/, function() {

接下来，您总是先设置currentIndex为auto，然后再设置为0，而不是检查它是否等于auto。

if ( currentIndex ==/*fixed*/ "auto" ) {

此外，您最初设置currentIndex为字符串，当您尝试增加它时，它只会将字符串转换为数字。您必须首先尝试将其转换为 a Number，检查以确保它是 a Number，然后将其递增。

所以固定的代码应该是：

  $(document.body).on('click', '.icon-layer-up', {}, function() { 
      console.log($(this).parent(".ui-wrapper").css("z-index"));
      var currentIndex = Number($(this).parent(".ui-wrapper").css("z-index")); 
      if ( isNaN(currentIndex) ) { // if is not a number, set it to 0
        currentIndex = 0;
      }
      var num = currentIndex++;
       $(this).parent(".ui-wrapper").css("z-index", num );
    });

接下来，请确保您阅读了z-index，并了解它是如何工作的。z-index不会应用于默认position为 的元素static。尝试将您的元素设置position: relative;为您尝试应用的元素z-index。

参考z-index：
了解 CSS z-index
添加 z-index

于 2013-10-17T01:53:29.977 回答