javascript - "onfocus"事件不适用于动态附加的输入

Question

当我动态附加输入时，onfocus 函数不起作用。

我的代码

 $i=1;
<?php for($i=0;$i<=5;$i++){?>
      <input type="text" onfocus="myFun(<?php echo $i?>)">
<?php}?>

我的功能是

function myFun(val){
      alert(val);
}

Answer 1

如果你可以使用 jQuery，你可以这样做。动态添加的输入将以这种方式工作并获得焦点。

//******************************************************************
// JAVASCRIPT
//******************************************************************

// some function to do after focus.
// takes a value variable called val
function myFun(val){
  console.log(val);
}

// If you use the on method this way even if you
// add inputs after the DOM is loaded, then any 
// inputs with the class name "myInput" will 
// pass the focused value of the input to the myFun
// function above.
$("body").on("focus", ".myInput", function(){
  myFun($(this).val());
});

//******************************************************************
// PHP
//******************************************************************
<?php
  for($i=0;$i<=5;$i++){
    echo "<input type='text' class='myInput' value='test value here => ".$i."'>";
  }
?>