JQuery值不保存？答案

【问题标题】：JQuery value not saving?JQuery值不保存？
【发布时间】：2016-01-14 11:47:04
【问题描述】：

我有两个 div，点击它会将 ID 值保存到变量中，该值保存到变量中，但在运行其他函数时未定义。

请看一下它应该更有意义。

//Setting the click amount
var ClickedAmount = 1
    //On a note click run...
$(".note").click(function() {
    //If Click amount == 2 run
    if (ClickedAmount == 2) {
        //Alert NoteOne - This should be a value
        alert(NoteOne);
    };
    //If Click amount is == 1 run
    if (ClickedAmount == 1) {
        //Get the ID of the element that was clicked on and
        //replace note id with nothing.
        var NoteClicked = this.id.replace('note', '');
        //NoteOne - Now == the Divs number id Selected. 
        var NoteOne = NoteClicked
        alert(NoteOne);
        //Clicked amount added so other if statements runs on next click
        ClickedAmount++;
    };
})

有什么建议吗？

【问题讨论】：

标签： javascript jquery html var

【解决方案1】：

您可以在这里找到working fiddle。

NoteOne 变量是函数中的局部变量。一旦函数执行结束，变量就会被遗忘。如果要持久化该值，请将变量设为全局变量。

var NoteOne = null;
//Setting the click amount
var ClickedAmount = 1
    //On a note click run...
$(".note").click(function() {
    //If Click amount == 2 run
    if (ClickedAmount == 2) {
        //Alert NoteOne - This should be a value
        alert(NoteOne);
    };
    //If Click amount is == 1 run
    if (ClickedAmount == 1) {
        //Get the ID of the element that was clicked on and
        //replace note id with nothing.
        var NoteClicked = this.id.replace('note', '');
        //NoteOne - Now == the Divs number id Selected. 
        NoteOne = NoteClicked
        alert(NoteOne);
        //Clicked amount added so other if statements runs on next click
        ClickedAmount++;
    };
})

【讨论】：

感谢您的所有回复现在都有意义

【解决方案2】：

变量NoteOne 将被提升到顶部。结果它显示未定义。如果您想让它按照您的期望工作，那么将 NoteOne 变量声明移到事件侦听器之外。换句话说，将其移至该事件侦听器的词法范围。

var NoteOne;
var ClickedAmount = 1
$(".note").click(function() {
.
.

DEMO

【讨论】：

【解决方案3】：

你应该在你的函数之外声明NoteOne：

//Setting the click amount
var ClickedAmount = 1
var NoteOne;

//On a note click run...
$(".note").click(function() {

  //If Click amount == 2 run
  if (ClickedAmount == 2) {
    //Alert NoteOne - This should be a value
    alert(NoteOne);
  };

  //If Click amount is == 1 run
  if (ClickedAmount == 1) {

    //Get the ID of the element that was clicked on and
    //replace note id with nothing.
    var NoteClicked = this.id.replace('note', '');

    //NoteOne - Now == the Divs number id Selected. 
    NoteOne = NoteClicked

    alert(NoteOne);

    //Clicked amount added so other if statements runs on next click
    ClickedAmount++;

  };
})

.note {
  width: 200px;
  height: 50px;
  margin-left: 5px;
  margin-top: 50px;
  background-color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="" method="post">

  <div id="note1" class="note">Note 1</div>
  <div id="note2" class="note">Note 2</div>

  <!-- The input section, user clicks this to login on. -->
  <input id="submit" name="submit" type="submit" value="Login">

</form>

【讨论】：