onchange for id 后，onclick 功能将不起作用

Question

当我在开始时给我的输入一个 id 时，我的按钮就可以使用 onclick 功能正常工作。 但是，如果我使用 onchange 函数为我的按钮分配一个 id，当 id 正确时，我的按钮不会对 onclick 函数做出反应。 谁能帮我这个。

这有效：

 <input type="button" class="ok" value="Execute" id="mercedes"/>
 <script>
 $('#mercedes').on('click', function(e){
 ......
 </script>

这不起作用：

 <select id="abc" onchange="func()">
   <option  value="volvo" id="1">Volvo</option>
   <option value="saab" id="2">Saab</option>
   <option value="mercedes" id="3">Mercedes</option>
   <option value="audi" id="4">Audi</option>
 </select>
 <input type="button" class="ok" value="Execute"/>
 <script>
     function func() {
         var b = document.getElementById("abc");
         var a= b.options[b.selectedIndex].value;
         $('input.ok').attr('id', a);
      }
 </script>
 <script>
 $('#mercedes').on('click', function(e){
 ......
 </script>

当我从选项中选择 mercedes 时，我的输入将获得 id mercedes，但 onclick 功能仍然不起作用。

Answer 1

$('#mercedes').on('click', function(e){

这是在页面加载时发生的。 该元素还没有 id。 一旦设置了 id，您需要在 on change 中附加事件。

function func() {
     var b = document.getElementById("abc");
     var a= b.options[b.selectedIndex].value;
     $('input.ok').attr('id', a);
     $('#' + a).on('click', function(e){
          // do something
     });
  }

小提琴： http : //jsfiddle.net/bt3dsrbx/