Question

我创建了一个脚本，其中将根据选项的选择创建输入字段和按钮。现在我想在点击按钮时执行一个功能。以下是我的代码：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="abc">
    <option value="1">a</option>
    <option value="2">b</option>
    <option value="3">c</option>
</select>
<div id="sd"> </div>

功能

$(document).ready(function () {
   i=0;
   $("#abc").on('change',function() {
   var maindiv= document.createElement('div');
       maindiv.setAttribute("id","TextBoxesGroup");
       var secdiv=document.createElement('div');
       secdiv.setAttribute("id","TextBoxDiv1")
       maindiv.appendChild(secdiv);
       var ipt=document.createElement("input");
       ipt.setAttribute("type","text");
       ipt.setAttribute("id","textbox1");
       secdiv.appendChild(ipt);
       var ad=document.createElement("input");
       ad.value= "+";
       ad.type="button";
       ad.style.width="30px";
       ad.setAttribute("id","addButton"+i);
       ad.onclick=fu_a(this.id);
       secdiv.appendChild(ad);    
       var division= document.getElementById("sd");
       division.appendChild(maindiv);
       i++;
    });
 });      

 function fu_a(id){
     alert(id);
 }

此处点击按钮功能应该执行。但实际上它在更改选项时会被执行。这是我的小提琴：

https://jsfiddle.net/Safoora/ssvjjg6e/16/

Answer 1

只需使用此

ad是您动态创建的按钮

ad.addEventListener("click", function(){
   alert("button clicked");
});

点击功能动态创建按钮

1 个答案: