Question

我可以让$("#demoMapPut").click(function(){ console.log("Success!");});作为HTML页面中的事件处理程序工作。

但是，如果我将其更改为：

$("#demoMapPut").click(onPutMap);

    var onPutMap = function(evt){
        console.log("This is a Test");
    }

它似乎不再存在了。有人可以指出我做错了什么吗？这只是一个简单的例子，我单击带有id="demoMapPut"的HTML按钮，并在控制台中显示一条消息。

Answer 1

简单。在处理程序之前声明函数。

var onPutMap = function(evt){
  console.log("This is a Test");
}

$("#demoMapPut").click(onPutMap);

现在，让我们混合一些最佳实践（以及我的强迫症）。

首先，最好根据他们处理的来命名处理程序。所以不是'onPutMap'而是'onClickMapPut'会更好。另外，我建议也使用'on'而不是点击快捷方式。此外，总是使用单引号进行字符串声明是很好的。所以我的OCD重写看起来像这样：

var onClickDemoMapPut;

onClickDemoMapPut = function ( event ) {
  console.log( 'This is a test' );
}

$( '#demo-map-put' ).on( 'click', onClickDemoMapPut );

我知道这些都很简单，也许看起来很傻，但有些可以节省很多时间。例如，查看处理程序名称'onClickDemoMapPut'：约定告诉我完全要调用它的内容。这有助于减少愚蠢的错误和认知开销。

此外，围绕混合大小写类和ID名称存在x浏览器问题。为了这些目的，仅使用小写是明智的。此外，类名称具有破折号作为命名空间的形式，并避免使用混合大小写。

干杯，祝你好运！

jquery点击功能说明

1 个答案: