值未传递给动态创建的onclick函数

时间:2015-10-13 09:38:52

标签: javascript html google-apps-script onclick

我有一个按钮Add Filter,当下拉列表Choose table中的值发生变化时,我会动态创建该按钮。我在JavaScript中添加了Add Filter的onclick atttribute,我想传递一个参数。但是,当我通过filterButton.onclick=addFilter(db);传递参数时,即使正确传递db的值,它也会在我单击它之前执行addFilter()。如果我给filterButton.onclick=addFilter();并尝试访问db作为this.db OR db作为全局变量,它将分别打印undefined和null。

我要做的是,当我点击按钮addFilter(db)时执行Add Filter,它应该获得所选数据库的值,即所选的下拉列表。我做错了什么?

这是JSFiddle

<!DOCTYPE html>
<html>
  <body>


    <script>

 function get_ids(db){

//return ids;
 }

function clearDivs(){

    //Clears view    
    }
function chooseTable(db) {

 clearDivs();

 var div = document.getElementById("table"); 

var ids=get_ids(db);
var parentElement = document.getElementById('ids');

//adding checkboxes (removed here for simplicity)

 var filter = document.getElementById('filter');
 var filterButton=document.createElement('input');
 filterButton.type='button';
 filterButton.value='Add Filter';
 filterButton.onclick=addFilter(db);
 filter.appendChild(filterButton);


 }

 function addFilter(db){
 window.alert(db);     
 }  

 </script>
  <center>

<div id="main1">

<div>

Choose Table:<br/>

<select id="table" name="table" onchange="chooseTable(this.value)">

     <option name="choice" value=""></option>
    <option name="choice1" value="hr.employee">Employees</option>
    <option name="choice2" value="account.account">Accounts</option>
    <option name="choice3" value="hr.holidays">Holidays</option>
    <option name="choice4" value="account.voucher">Account Vouchers</option>
  </select>
</div>
</div>  
</center>
<div id="ids"></div>

<center>

<br/><br/><br/><br/>

<div id="filter"></div>

<br/><br/><br/><br/>

<input type="button" id="clicking" value="Get result" onclick="getResults();"/>
<div id="check1"></div>
</center>

  </body>
</html>

1 个答案:

答案 0 :(得分:0)

您可以尝试的一个选项是:

...
// filterButton.onclick=addFilter(db);
filterButton.onclick = (function(current_db) {
                           return function() {
                               addFilter(current_db);
                           }     
                       })(db);
...

JSFiddle demo