提取并调用元素的onclick HTML属性中定义的JavaScript函数（使用jQuery attr / prop）

Question

我有2个按钮A和B，我需要调用在按钮B的onclick HTML属性中定义的函数，但是在按钮A上单击。

在这种情况下，我还需要向该函数传递额外的参数。 按钮就像：

<input type="button" id="btn_a">  
<input type="button" id="btn_b" onclick="return doSomething(p,q)">

我想打个电话：

doSomething(p,q,r) // 3rd param to identify that it was clicked via button A

按钮B实际上是一个可变按钮，并动态获取p，q参数，我需要传递第3个参数。

按钮B可以具有onClick属性，例如

onClick= return doSomething(122,334) or return doSomething(abc,54)

或其他任何值。 我需要调用该函数

doSomething(122,334,'btn_a') or

doSomething(abc,54,'btn_a')

如何使用jQuery / JS实现呢？ 我可以使用.prop()调用该函数，但无法弄清楚是否传递了其他参数。

我能够像这样调用该函数：

<script>
    jQuery('#btn_a').on('click',function(){
      (jQuery('#btn_b').prop('onclick'))(); //this can invoke the function but how to pass the additional param?
    })
  </script>

提前致谢。 :)

Answer 1

您可以这样操作，即使用attr而不是prop来获取b的onclick的字符串值，然后用p,q,r替换字符串中的参数p,q ，然后使用Function构造函数创建带有新机体（更换后）。

jQuery('#btn_a').on('click', function(){
    var onclickB = jQuery('#btn_b').attr('onclick'),
        onclickA = Function(onclickB.replace("p,q", "p,q,r"));
    return onclickA();
});

注意 ：您可以使用此方法执行任何操作，只需创建一个正则表达式模式即可将任何内容替换为所需内容。

Answer 2

您需要使函数doSomething如下所示，为btn_b传递null并为btn_a传递值。 希望这可以帮助。

的HTML

<input type="button" id="btn_a">  
<input type="button" id="btn_b">

脚本

$("#btn_a").on("click", function() {
        return doSomething(p,q,r);
    });


$("#btn_b").on("click", function() {
        return doSomething(p,q,null);
    });


function doSomething(p,q,r){
        if(r != null){
        //do something for btn_a and return
        } else {
        //do something for btn_b and return
        }

    }

Answer 3

<input type="button" id="btn_a" onclick="return doSomething(p,q,r)">

Answer 4

为简单起见，您可以设置一些要传递给函数的全局变量/对象作为参数，然后调用该函数并使用全局变量/对象属性值。

你说的话 ;）

/* with variables in global scope should be accessible inside function going to call */
param1 = 1;
param2 = 2;

/* function definition */
function functionCalling(){
  /* use values here */
  console.log(param1, param2);
}

...
functionCalling();
...

/* with variables in global scope should be accessible inside function going to call */
param = {property1:1, property2:2};

/* function definition */
function functionCalling(){
  /* use values here of object */
  console.log(param.property1, param.property1);
}

...
functionCalling();
...