Question

可以稍微恢复与this相关联的先前值吗？

我正在创建一个动态菜单，对我来说是必要的......不幸的是代码太长了，我无法将它带回到这里或jsfiddle，但我创建了一个简单的例子，你理解我的意思：

<div id="block-system-main-menu">
 <ul>
    <li><a href='#'>Mappe</a></li>
    <li><a href='#'>Vulc</a></li>
    <li><a href='#'>Equa</a></li>
 </ul>
</div>

这里是js代码：

$('#block-system-main-menu').on('click', 'li', function () {


if ($(this).children('a').text() != cliccato) {

    $(this).append('<span> clicked</span>');
    alert('not equal');


} else if ($(this).children('a').text() == cliccato) {
    $(this).find('span').remove();
    alert('equal');

}
//
var cliccato = $(this).children('a').text();

});

这里是jsfiddle： http://jsfiddle.net/ve1cd5vx/

几乎是第一次点击链接我添加了跨度，但是当我再次点击同一链接时不会删除跨度...

所以不能使用js代码的else if ...因为变量cliccato未定义，但是如果有办法恢复以前的this值，它会全部解决..

（其他已经证明如何根据我的情况创建基于点击次数来更改值的变量的解决方案只会极大地扩展代码）

谢谢，对不起我的英文

Answer 1

您需要做的就是存储单击的上一个元素。由于您在函数内部执行此操作，var cliccato仅在该函数中可用，并且它不存在于外部（范围）。

相反，您可以将cliccato设为全局变量，这样您就可以读取并更新函数内的值。

编辑：正如@davcs86指出的那样，还有一个问题就是没有添加第二个<span>，所以我添加了一行来删除任何跨度，然后再添加新的一个来解决这个问题。

JSFiddle：https://jsfiddle.net/8rfpmts0/1/

var cliccato = null; // now declared OUTSIDE the function
$('#block-system-main-menu').on('click', 'li', function () {


    if ($(this).children('a').text() != cliccato) {
        $(this).find('span').remove(); // Don't add extra spans
        $(this).append('<span> clicked</span>');
        alert('not equal');


    } else if ($(this).children('a').text() == cliccato) {
        $(this).find('span').remove();
        alert('equal');

    }
    //
    cliccato = $(this).children('a').text();

});

Answer 2

您可以利用jQuery选择器，类似这样的

$('#block-system-main-menu').on('click', 'li', function () {
    if (!$(this).is(".wasclicked")) {
        $(this).append('<span> clicked</span>');
        $(this).addClass("wasclicked");
    } else {
        $(this).find('span').remove();
        $(this).removeClass("wasclicked");
    }
});

JSFiddle demo

<强>更新

您也可以使用IIFE，

var cliccato = false; // now declared OUTSIDE the function
$('#block-system-main-menu').on('click', 'li', (function (thisCliccato) {
    return function () {
        if (!thisCliccato) {
            $(this).append('<span> clicked</span>');
        } else {
            $(this).find('span').remove();
        }
        thisCliccato = !thisCliccato;
    }
})(cliccato));

JSFiddle demo

如何恢复以前的值（javascript）？

2 个答案: