Question

我想知道为什么下面的代码对我不起作用。

我想要做的只是在点击输入字段时在控制台上打印一些内容。

我点击“点击我”按钮生成输入字段。每个输入都有onclick属性，如下所示：onclick="popup()"。

有人可以解释为什么我要做的事情不起作用吗？

$(document).ready(function(){
        
    function popup(){            
     	console.log("clicked");            
    }	
        
    $('#btn').on('click', function() {
        $('body').append('<input type="aText" id="inputField" onclick="popup()">');
    });		              
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

    
<button type="button" id="btn">Click Me!</button>
    
<div id = "range-calendar"></div>

Answer 1

在popup()的外部声明$(document).ready(function()函数。

<强>为什么吗

如果您将popup函数称为未定义，因为它仅在$(document).ready(function()函数上定义，而不是全局.so，而其外部调用全局popup()

$(document).ready(function() {
  $('#btn').on('click', function() {
    $('body').append('<input type="aText" id="inputField" onclick="popup()">')
  })

})
  function popup() {
    console.log("clicked");
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" id="btn">Click Me!</button>

<div id="range-calendar"></div>

Answer 2

在popup()函数

之外声明$(document).ready(function()函数

＆＃13;

$(document).ready(function(){

$('#btn').on('click', function(){
    $('body').append('<input type="aText" id="inputField" onclick="popup()">')
})      

});

function popup(){
    console.log("clicked");
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button type="button" id="btn">Click Me!</button>

<div id = "range-calendar"></div>

＆＃13;

Answer 3

试试这个：

<script>
function popup(){

    console.log("clicked");

}   

$(document).ready(function(){
$('#btn').on('click', function(){
    $('body').append('<input type="aText" id="inputField" onclick="popup()">');
});      
});
</script>

Answer 4

使用可以使用以下代码。

$(document).on('click','#inputField',function(e){
 // code goes here.
});

没有为动态生成的输入定义onclick函数

4 个答案: