Question

这是我面临的问题 - 我正在使用一个div（＆＃39; myDiv＆＃39;）。我设置了一个setInterval函数，它每2秒运行一次。我想要的是每次setInterval执行时，我想旋转div＆＃39; 15deg＆＃39;额外。

我做得差不多了。但是当我做一些字符串操作时，它就出错了。 //这是代码。

// css转换必需值= 15ddeg不是＆＃39; 15deg＆＃39; 那么如何提取＆＃39; 15deg＆＃39;到15deg（没有qoute）

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-git2.js"></script>
<meta charset=utf-8 />
<script>

      $(function(){
        var foo = setInterval('animateDiv()', 2000);
    var count = 15;

    function animateDiv(){
       //console.log(count);

    count += 10;

       $('.myDiv').css({'-webkit-transform':'rotate(count + "deg")'});

      //console.log(count + "deg");
    }
      });

</script> 
<title>JS Bin</title>
</head>
<body>
  <div class='myDiv'></div>
</body>
</html>

Answer 1

http://jsfiddle.net/RWQSC/

(function(){
        var intId = setInterval(animateDiv, 2000),
            count = 15,
            $myDiv = $('.myDiv'); //Cache the div so we don't keep looking though the DOM for the same element. 

    function animateDiv(){
       console.log(count);
       count += 10;
       $myDiv.css({'-webkit-transform':'rotate(' + count +'deg)'});
       //console.log(count + "deg");
    }

}());

Answer 2

两个问题，

首先，设置转换，你实际上在值字符串中使用字符串'count'，你需要将count的值连接到字符串而不是仅使用字符串：

$('.myDiv').css({'-webkit-transform':'rotate('+count+'deg)'});

其次，你得到一个JavaScript控制台错误，它无法找到函数animateDiv，因为你的函数不是全局函数，并且实际上在on-load事件中，你无法通过字符串找到它这样命名，只是尝试直接传递函数（注意，不包括括号，我们不想调用函数，我们只是将它指定为参数）：

var foo = setInterval(animateDiv, 2000);

Answer 3

我没有解决你的问题，但你可以这样做

var index = deg.indexOf('\'');
var LastIndex = deg.LastIndexOf('\'');
deg = deg.substring(index+1,LastIndex);

Answer 4

这似乎有效：

function animateDiv() {
    // console.log(count);

    count += 10;

    $('.myDiv').css({
        '-webkit-transform': 'rotate(' + count + 'deg)'
    });

    //console.log(count + "deg");
}

var count = 15;
var foo = setInterval(animateDiv, 500);

jsFiddle

Answer 5

Fiddle!

var count = 15;

function animateDiv(){
    count += 10;
    $('#myDiv').css({'-webkit-transform': 'rotate(' + count + 'deg)'});
    console.log('rotate(' + count + 'deg)');
}

var foo = setInterval(animateDiv, 2000);

Answer 6

如果你想要最高速度，你不应该使用jQuery，你应该将你的元素缓存在animateDiv之外。

永远不要将setInterval / setTimeout与字符串一起使用，因为它们会使用魔鬼eval！

var el = document.getElementsByClassName('myDiv')[0],
    count = 15,
    foo = setInterval(animateDiv, 2000);
function animateDiv(){
    count += 10;
    el.style.transform = 'rotate('+count + 'deg)';
}

演示：http://jsfiddle.net/thdyL/1/

修改：

如果你想提高速度（但你会失去可读性），你也可以使用

var style = document.getElementsByClassName('myDiv')[0].style, count = 15, foo = setInterval(animateDiv, 2000); function animateDiv(){ style.transform = 'rotate('+ (count += 10) + 'deg)'; }

你应该考虑使用id代替class，因为它只是一个元素。

从字符串中提取内部内容

6 个答案: