Question

我尝试执行状态检查以启用/禁用设置。

    // file 1
    function settings( valStatus ){
        var status = valStatus;

        this.getStatus = function(){
            return status;
        }

        this.setStatus = function( valStatus ){
            status = valStatus;
        }
    }

在这里调用此函数：

    // file 2
    $settings = new settings( false );

    $(document).ready(function() {
        $( '#openSettings' ).on('click', function() {
            $settings.setStatus( true );
            enableSettings();
        });

        $('#save').on('click', function(){
            $settings.setStatus( false );
            closeSettings();
        });
    });

    // file 1
    enableSettings = function() {

        if( $settings.getStatus() === true ){

            //toggle emptyLink
            $('.myButton').on('click', function(){
                alert($settings.getStatus());
            });

        }
    }

所以当点击“myButton”时启动没有任何反应。点击“openSettings”然后点击“myButton”后，我收到警告“true”; 点击“保存”然后再次点击“myButton”后，我收到警告“假”，但它甚至没有触发，因为我检查了它...可以有人帮我吗？我的错误在哪里？

Answer 1

我想您可能希望将状态检查放在.myButton点击处理程序中而不是外部。这样，您只需要应用处理程序一次，它将工作与否，具体取决于status的值。

$(document).ready(function() {
    var $settings = new settings( false );  // keep out of global scope

    $( '#openSettings' ).on('click', function() {
        $settings.setStatus( true );
    });

    $('#save').on('click', function(){
        $settings.setStatus( false );
    });

    $('.myButton').on('click', function(){
        if ($settings.getStatus()) {
            alert($settings.getStatus());
        }
    });
});

Answer 2

首先，您可以使用比例如更少的代码编写JavaScript。 Java的。您不需要getter和setter方法，因为没有包可见性。由于您不对setter执行任何操作，因此您可以直接访问字段。这样可以减少读取的代码，减少可能出错的代码。所以摆脱无用的代码（记住这不是请求做代码单行）。在互联网上搜索“干净的代码”。

由于您使用JavaScript，因此您可以做得更好。存储信息的较小方法。

var mySetting = {};
mySetting.status = true

console.log( mySetting.status );
mySetting.status = false;
console.log( mySetting.status );

请记住保持全球空间清洁！在互联网上搜索“javascript全球范围污染”。所以在你的范围内这样做。

您的主要问题是，您正在使用闭包。你可能不想在你的情况下使用它。在互联网上搜索“javascript封面教程”。那里有很多好的。

由于您使用的是Jquery，因此可以使用.data（）函数来存储您的信息。

请参阅http://api.jquery.com/jquery.data/

$(function(){
    $( '#openSettings' ).on('click', function() {
        $('#settings').data( "status", true );
        enableSettings();
    });

    $('#save').on('click', function(){
        $('#settings').data( "status", false );
        closeSettings();
    });

    $('.myButton').on('click', function(){
        alert($('#settings').data());
    });
});

或者在HTML本身内。见http://api.jquery.com/attr/

$('#settings').attr( "status", true );
console.log( $('#settings').attr( "status" ) );

或作为开关。

$('#settings').addClass( "settingsEnabled" ); 
$('#settings').removeClass( "settingsEnabled" ); 
console.log($('#settings').hasClass('settingsEnabled'));

如果要存储对象引用和HTML以获取交换机等简单信息，请使用.data（）。好处是，即使使用CSS也可以获得该信息。

请在你自己的代码中删除$前缀，因为它没有任何意义。如果您使用像angular这样的框架，它将帮助您识别原点或类似于（“不要”）使用它。

JavaScript忽略了bool

2 个答案: