Question

我有一个图标，点击后会增加数字输入的值。

我最初把它写成：

 $('.icon-chevron-up').click(function(){
      var input = $(this).next();
  var value = eval(input.val());
  input.val((value+1).toString());
  $(this).next.val(value+1);
 });

然后我把它重写为：

 $('.icon-chevron-up').click(function(){
  $(this).next().val((eval($(this).next().val()) + 1).toString());
 });

有没有首选的方法呢？如果是这样，为什么？

Answer 1

这些都不是效率最好的。不需要eval，如果你想要性能，你应该缓存你的选择器。有几种方法可以让它更有效但我会这样做：

$('.icon-chevron-up').click(function() {
  var $this = $(this), 
      val = $this.next().val();
  $this.next().val( ++val + '' );
});

++将val投射到一个数字并添加1。 + ''将前一个数字转换为字符串。

如果你想要更简洁的东西（我猜更可读）：

$this.next().val( (parseInt( val,10 ) + 1).toString() );

Answer 2

输入是什么意思？它应该是文本输入还是只是一个html标签？

<button class="icon-chevron-up">Increase</button>
<div id="numinput">12</div>

var input = $('#numinput').html();
$('.icon-chevron-up').click(function(){    
    input++;
    $('#numinput').html(input);     
});

Javascript：哪些实现更有效/更好？

2 个答案: