java如何将动态参数传递给jquery函数

Question

我想向jquery onClick事件传递一些动态参数。之前，我使用了以下HTML和JavaScript：

<!-- HTML -->
<a id="link123" href="link1" onClick="javascript:func1(${param1},${param2});">123</a>

/* JavaScript */
func1(param1,param2) {
   // do something
}

参数param1和param2来自后端代码，是动态的。我如何得到这个在这里并不重要

使用jQuery之后，我有了以下HTML和JS：

<a href="link123">
<input type="hidden" id="param1" value="${param1}"/>
<input type="hidden" id="param2" value="${param2}"/>

$(document).ready(function() {
  $("#link123").click(function() {
    var param1 = $("#param1")[0].value;
    var param1 = $("#param1")[0].value;
    func1(param1,param2);
  });
});

func1(param1,param2) {
  //do something
}
function func1 is there as before.

我对这个解决方案不满意（将参数作为内联隐藏值传递）。在这种情况下，还有什么更好的方法可以将动态参数传递给jQuery

Answer 1

你可以像以前一样内联这些参数

  $("#link123").click(function() {
    func1(${param1}, ${param2});
  });

也就是说，您的PHP（或其他什么）会生成带有已替换参数值的javascript

Answer 2

我假设您正在尝试将变量值从后端脚本语言传递到Javascript？一种可能的方法是将它们直接输出到javascript

<script language='JavaScript'>
//it's a good idea to have all those vars collected in a single object in order to not overpopulate the global scope
var scriptOutput = {
    param1 : ${param1},
    param2 : ${param1}
}
$(document).ready(function() {
    $("#link123").click(function() {
        func1(scriptOutput.param1,scriptOutput.param2);
    });
});
</script>

Answer 3

为此，建议使用数据属性。使用：

<input data-param1="${param1}" />

然后：

$('input').click(function(){
   $(this).attr('data-param1');
});