Question

我的网站上有两个按钮。下一个和上一个。我想编写一个代码来在每次单击下一次时增加值，并在每次单击上一次时减小该值。我希望值在输入中显示。但输入中显示的值始终为0，并且不随点击次数而变化。

这是我的代码：

function count(){
    var $counter=0;
    $(".next-button").click(function() {
         $counter=$counter+1;
    });
    $(".previous").click(function() {
        $counter=$counter-1;
    });
    return $counter;
}

document.getElementById('counter').value =count();

Answer 1

此功能中不需要return。实际上，您根本不需要任何功能。相反，每当您更新它时都会显示counter。

var $counter=0;
$(".next-button").click(function() {
     $('#counter').val($counter++);
});
$(".previous").click(function() {
    $('#counter').val($counter--);
});

Answer 2

每次更改时都应更新元素中的值：

(function count(){
    var counter=0,
        $container = $('#counter');
    $(".next-button").click(function() {
        $container.text(++counter);
    });
    $(".previous").click(function() {
        $container.text(--counter);
    });
})();

Answer 3

全局声明计数器，因此它只会初始化一次

＆＃13;

var $counter=0;
		var count=document.getElementById('counter');
    	$(".next").click(function() {
         	count.value=++$counter;
    	});
    	$(".pre").click(function() {
        	count.value=--$counter;
        	
    	});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<button class="next">next</button>
	<button class="pre">pre</button>
	<input type="text" id="counter" value="0" />

＆＃13;

Answer 4

您的代码包含多个错误。您在count()函数中将变量重置为0，并将click()函数放在函数中。

var counter=0;
function count(){
    return counter;
}

$(".next-button").click(function() {
    counter = counter+1;
});
$(".previous").click(function() {
    counter = counter-1;
});

$('#counter').val(count());
// or 
$('#counter').val(counter);

我认为$('#counter')是输入文本框。

P.S。变量不需要以$为前缀。关于这种匈牙利符号的扩展reading：何时使用，何时不使用。

Answer 5

你可以这样做：

var $counter = 0;

$(".next-button").click(function() {
    $counter = $counter + 1;
    refreshCount();
});
$(".previous").click(function() {
    $counter = $counter - 1;
    refreshCount();
});

function refreshCount() {
    document.getElementById('counter').value = $counter;
}

//init
refreshCount();

Answer 6

首先，你的赋值表达式实际上是运行计数函数。

document.getElementById('counter').value =count();

计数功能返回0。

(function() {
  var $counter = 0;

  var add = function() {
    $counter ++;
    setCounterValue();
  }

  var del = function() {
    $counter --;
    setCounterValue();  
  }

  var setCounterValue = function() {
    document.getElementById('counter').value = $counter;        
  }

  $(".next-button").bind("click", add);

  $(".previous").bind("click", del);
})()

写一个计数器来计算点击次数

6 个答案: