如何使用实际参数在javascript中生成函数调用

How to generate a function call in javascript with actual parameters

本文关键字：函数调用 javascript 何使用 参数      更新时间：2023-09-26

我现在正在使用

return '<img src="../images/fam/bug.gif"/ onclick="showDetails(event,'''+
         IPatient+''','''+
         nom +''',''' + 
         prenom+''','''+
         mesure_decision+''','''+
         type_mesure+''')">';

我相信还有一种更优雅的写作方式。

有什么建议吗？

怎么样：

var img = document.createElement('img');
img.setAttribute('src', '../images/fam/bug.gif');
img.addEventListener('click', function (e) {
    showDetails(event, 'IPatient', 'nom', 'prenom', 'mesure_decision', 'type_mesure');
});
return img;

将它们放在一个数组中，然后使用.join()

var args = [IPatient,nom,prenom,mesure_decision,type_mesure];
return '<img src="../images/fam/bug.gif"/ onclick="showDetails(event,'''+args.join("','")+''');">';

尽管正如Antti Haapala所提到的，您确实应该正确地绑定事件处理程序，而不是使用on*=""属性

一个快速可行的集成解决方案：

var img = document.createElement('img');
img.src = '../images/fam/bug.gif';
var args = [IPatient,nom,prenom,mesure_decision,type_mesure];
if(img.addEventListener) img.addEventListener('click',function(e) { showDetails.apply([e].concat(args)); });
if(img.attachEvent) img.attachEvent('onclick',function(e) { showDetails.apply([e].concat(args)); });
return img;

创建事件处理程序总是比内联更好，因为您对它有更多的控制权。

var img = document.createElement('img');
img.myInfo=[IPatient,nom,prenom,mesure_decision,type_mesure];
img.src='../images/fam/bug.gif';
img.addEventListener('click',showDetails,false);
return img;

在函数内部showDetails

function showDetails(e){
 console.log(this.myInfo,e,e.target)
 var i=this.myInfo;
 console.log(i[0],i[1],i[2],'....');
 //if you want aslo more control here use {'IPa':IPatient,'nom':nom.....}
 // so that you can write i.IPa, i.nom.....
}

在这种情况下，如果稍后删除映像，则可以使用removeEventListener但最重要的是，以后修改现有代码更容易。

function deleteImage(e){
 delete this.myInfo
 this.removeEventListener('click',showDetails,false)
 //.... 
}

javascript中的所有内容都是一个对象，因此您可以添加参数。在这种情况下，这是非常有用的。

即

img[img.addEventListener?'addEventListener':'attachEvent']('click',showDetails);
img[img.removeEventListener?'removeEventListener':'detachEvent']('click',showDetails);
function showDetails(e){
 e=e||window.event;
 console.log(this.myInfo,e,e.target||e.srcElement);
}
相关文章：