动态按钮点击不Jquery的

问题描述：

http://www.script-tutorials.com/creating-an-attractive-presentation-with-html5/

本教程是确定的静态内容开发HTML5演示动态演示的内容。但我想写jQuery的动态内容如下：

$(document).ready(function(){ 

      $.getJSON(url, function (data) { 

        for(var i in data) 
         {        
         output=" <button title='Next' id='nav-next' class='nav-next'>Click</button>";      
         } 

        $("#placeholder").append(output); 
       }); 
});

当点击按钮，我想去下一张幻灯片。但是这个事件不起作用。我想在JavaScript文件上调用下一个函数。请帮忙。

我很困惑，为什么它在for循环中时，你从来没有使用我？ – 2013-02-26 02:52:36

重复：http://*.com/questions/203198/event-binding-on-dynamically-created-elements ::（使用'。对（）'方法：http://api.jquery.com/on /） – 2013-02-26 02:52:46

你只是附加的按钮，但它永远不会绑定到任何特定的功能。 – rkrdo 2013-02-26 02:54:54

答

你不是一个事件附加到新的按钮，这样可以使用jQuery click方法来完成。

也有一些其他问题：

环路看来，你实际上并没有使用任何东西是多余的data。
output在您的示例中被定义为全局变量，请使用var将其保留在函数范围内。

代码：

$(document).ready(function() { 
    $.getJSON(url, function (data) { 

     // use var, your output was a global variable 
     var output = " <button title='Next' id='nav-next' class='nav-next'>Click</button>";      

     $("#placeholder").append(output); 

     // attach the click event to the new button 
     $('#nav-next').click(function() { 
      // TODO: Implement click method 
     }); 
    }); 
});

既然你不使用数据可以删除调用getJSON安全当前。不过，我认为你出于某种原因放入了它。

答

你说：“当点击按钮”，并且是答案使用jQuery.on()方法。

$('#nav-next').on('click',(function() { 
    // click code. 
});

，然后当你创建DOM在.on定义将有动态连接点击事件ID。

动态按钮点击不Jquery的

相关推荐