将参数传递给动态生成元素的单击事件

我试图将参数传递给动态生成元素的onclick事件。我已经看到了现有的stackoveflow问题，但它没有回答我的具体需求。在这个存在的问题中，他们试图使用$（this）.text（）来访问数据。但我不能在我的例子中使用这个。将参数传递给动态生成元素的单击事件

Click event doesn't work on dynamically generated elements

在下面的代码片段，我试图通过程序和macroVal到onclick事件，但它不工作。

onClickTest = function(text, type) { 
     if(text != ""){ 
     // The HTML that will be returned 
     var program = this.buffer.program; 
     var out = "<span class=\""; 
     out += type + " consolas-text"; 
     if (type === "macro" && program) { 
      var macroVal = text.substring(1, text.length-1); 
      out += " macro1 program='" + program + "' macroVal='" + macroVal + "'"; 
     } 
     out += "\">"; 
     out += text; 
     out += "</span>"; 
     console.log("out " + out); 


     $("p").on("click" , "span.macro1" , function(e) 
     { 
      BqlUtil.myFunction(program, macroVal); 
     }); 

    }else{ 
     var out = text; 
    } 
    return out;

};

的执行console.log出来给我这个

<span class="macro consolas-text macro1 program='test1' macroVal='test2'">{TEST}</span>

我曾经尝试都this.program和程序，但它不能正常工作。

来源

2017-02-15 user911

获取属性span元素的值，因为你将它们包含在HTML：

$("p").on("click" , "span.macro" , function(e) 
{ 
    BqlUtil.myFunction(this.getAttribute("program"), 
    this.getAttribute("macroVal")); 
});

有，但是，几件事情错在你的代码。

你分配给out HTML指定两次class属性，
您使用单引号是不正确的（使用'，不’），属性值的
引号搞砸：对属性值始终使用单引号或双引号

var out = "<span class='";

...

out += "' class='macro' program='" + program + "' macroVal='" + macroVal + ;

...

out += "'>";

取决于你打算多少次调用onClickTest，你可能最终与多个click事件^ h p span.macro。

来源

2017-02-15 15:14:12 Igor

我已经移动了onClickTest之外的偶处理程序代码。后来我意识到，如果我把它放在函数内部，我的函数根本没有被触发，只有onkekevent被触发。你能给我一个如何传递参数的示例代码片段吗？ – user911

@ user911 - 是的，我将它添加到我的答案中。您正在生成不正确的HTML。在返回之前调用'console.log（out）;'仔细检查结果。 – Igor

您的回答帮助我解决了我的html引用问题，但我仍然无法通过参数。我已经提出了你的答案，但仍然不能接受。我已经尝试了这个。程序和程序。它不起作用。我也更新了我的问题以解决报价问题，请检查。 – user911

将参数传递给动态生成元素的单击事件

回答

相关问题