函数作为参数的话，怎么调用？

Question

var vAlert = function (data) {
    //$(obj).onclick = data.fa;
    var html_str = "<button onclick="data.fa">button</button>";
    document.body.insertAdjacentHTML("beforebegin", html_str );
};

调用的时候：

vAlert({
    fa:function(){
        alert("fa");
    }
    ,fb:function(){
    }
})

这样无法调用，不知道应该怎么写

Answer 1

传参没问题，问题出在你给 jq 对象绑定了原生 js 的 onclick 事件，当然绑错了，可以通过.get(index) 获得原生的 js 对象，再绑定

var vAlert = function (data) {
    $(obj).get(0).onclick = data.fa;    
};

jq 的绑定好像是这样的：

var vAlert = function (data) {
    $(obj).click(data.fa);    
};

Answer 2

<div class="box">demo</div>
<script>
~function($) {
  var vAlert = function (data) {
    $(obj).onclick = data.fa;
  },
  obj = '.box';
  vAlert({
  fa : function() {
    alert("fa");
  },
  fb : function() {
  }
  });
}(function(s) {
  return document.querySelector(s);
});
</script>

Answer 3

解决

html字符串拼接的那句代码改成

var html_str = "<button onclick=\"("+data.fa+")()\">button</button>";

原因

1. 你拼接的时候,引号没使用正确
2. 即使引号拼接对了,onclik的值也有问题

原理

绑定事件处理函数有两种情况

• js中绑定,绑定函数就行了
• html中绑定,必须是绑定函数的调用,即必须在函数后面加()

建议

• 还是通过js绑定比较好,或者直接绑定一个具名函数,这种绑定函数体的作法,引号太多了,麻烦得很
• 了解一下犀牛书事件那一章