onclick 功能自动运行

Posted 2023-02-23

【中文标题】onclick 功能自动运行

【英文标题】：onclick function runs automatically

【发布时间】：2013-01-03 17:25:33

【问题描述】：

使用谷歌应用程序脚本我在运行传递参数的 js 函数时遇到问题。当我添加参数时，它将始终在页面加载时运行代码，而不是在单击按钮时运行代码。

直接来自htmlService的例子，没关系——当按钮被按下时运行...

document.getElementById('button1').onclick = doSomething;

但是当我如下向调用（和函数）添加参数时，它只在页面加载时运行一次（而不是在按下按钮时）...

document.getElementById('button1').onclick = doSomething('with_this_parameter');

任何对此行为的见解将不胜感激......如果答案很明显，对不起！

【问题讨论】：

() 后面的函数引用总是调用函数。

【参考方案1】：

当你说

document.getElementById('button1').onclick = doSomething('with_this_parameter');

这意味着调用doSomething('with_this_parameter')，然后将返回值赋给document.getElementById('button1').onclick。因此，这就是为什么当代码到达该行时它会被调用。该值是否可分配给该属性是另一个问题，但这就是它被调用的原因。

这样使用

document.getElementById('button1').onclick = function()
    doSomething('with_this_parameter');

参考：此解决方案由Mark Linus 提供。

【讨论】：

不客气。 Mark Linus 建议的答案是这样做的方法

用解决方案完成您的问题（从我的复制/粘贴），然后它将被标记为已接受

【参考方案2】：

这样做：

document.getElementById('button1').onclick = function()
    doSomething('with_this_parameter');

【参考方案3】：

我通常会这样做：

 // create button here or get button...
 var button1 = document.getElementById('button1').setName('button1');
 var clickHandler = app.createServerClickHandler('doSomething');
 button.addClickHandler(clickHandler);

 function doSomething(e)
   var button1 = e.parameter.button1;
   <do something with var button>
 

我不确定您要添加什么参数，但是如果按钮本身没有通过 .setId/getId 或 .setTag/getTag 传递它，则需要添加一个回调元素来传递它。如果是来自文本框：

 var textbox = app.createTextBox(); 
 var button1 =
 app.createButton.setName('button1'); 
 var clickHandler =        
 app.createServerClickHandler('doSomething').addCallbackElement(textBox);
 button1.addClickHandler(clickHandler);

希望这会有所帮助！

【参考方案4】：

要将函数引用分配给某个变量，您可以：

var a = doSomething;

doSomething 是一个函数。

但是当你必须传递参数并分配那个函数时

var a = doSomething(b);

这会导致麻烦，因为在将函数分配给变量时，它会被调用，而不是在它应该被调用的时候。

为了克服这个问题，你可以使用箭头函数或简单函数来调用你自己的带有参数的函数。

var c = () => doSomething(d);

这其实理解为 var c = anonymous_function;

或

var c = function() 
    doSomething(d);

因此你可以这样做：

document.getElementById('button1').onclick = () => doSomething('with_this_parameter');