Question

我制作了这个剧本，但是有一个问题。

当我点击addbutton时，控制台日志中的变量会收到每次点击的更新（1,2,3,4）。

但var fieldHTML永远是1，为什么？

var a = 1;

$(addButton).click(function(){ //Once add button is clicked

a++;

console.log(a);


});

var fieldHTML = a;

Answer 1

因为var fieldHTML = a;会将a的值复制到fieldHTML。

它不会创建参考。

更改a的值（在您设置fieldHTML的值之后）不会更改fieldHTML的值。

Answer 2

您需要将一个id或类应用于选择器，将其包装到文档就绪中，并传递＆＃34; a＆＃34;的新值。到一个函数，然后可以操作fieldHTML值。查看我使用警报来演示增加计数而不是console.log的片段说明 - 只是因为它在片段中。

＆＃13;

$(document).ready(function(){
     var a = 1;
      $('#addButton').click(function(){ //Once add button is clicked
       a++;
       alert("a = " + a);
       update_fieldHTML(a);
      });
  })

function update_fieldHTML(value){
var fieldHTML = value;
  alert("fieldHTML =" + fieldHTML);
  }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="addButton">Click Me</button>

＆＃13;

Answer 3

var addButton = $("#btn");
var viewButton = $("#btn-2");
var setButton = $("#btn-3");
var a = 1;
var fieldHTML = a; // on load, addign a value to fieldHTML variable  |  fieldHTML = 1

$(addButton).click(function() { //Inc by 1
  a++;
  console.log('a : '+a);
});

$(viewButton).click(function() {  //Show fieldHTML value in console
  console.log('fieldHTML : '+fieldHTML);
});

$(setButton).click(function() { // reassign a value to the fieldHTML variable  | on click event
  fieldHTML = a;
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button id='btn'>Inc a</button>
<button id='btn-3'>Set fieldHTML</button>
<button id='btn-2'>View fieldHTML</button>

Answer 4

var addButton = $("#btn");
var viewButton = $("#btn-2");
var a = 1;
var fieldHTML = a;

$(addButton).click(function() { 
  fieldHTML = increment();
  alert('a : ' + a);
});

$(viewButton).click(function() {
  alert('fieldHTML : '+fieldHTML);
});

function increment(){
   return ++a;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button id='btn'>Inc a</button>
<button id='btn-2'>View fieldHTML</button>

使用javascript增加变量

4 个答案: