创建页面 - 链接不工作

Question

我有一个选项卡HTML，基于这个例子：

http://inspirationalpixels.com/tutorials/creating-tabs-with-html-css-and-jquery

我试图做的是创建每个标签内的子页面。标签文本底部的箭头将您链接到更多文本，位于当前选项卡的div内。

它在HTML中工作，但是当我尝试使用Javascript创建相同的元素时，它不会。然后链接根本不起作用。

你可以明白我的意思是： http://codepen.io/anon/pen/gpPREB

的JavaScript我使用的是

function createArrow() { 
var ap = document.createElement("ul"); 
    ap.className = "tab-links"; 
    var a = document.createElement("a"); 
    var aText = document.createTextNode("> new arrow to tab 1, pg 2"); 
    a.appendChild(aText) 
    a.title = "Next"; 
    a.href = "#tab-1-pg-2"; 
    ap.appendChild(a); 
    document.getElementById("tab-1").appendChild(ap);     
} 

上为什么链接不起作用任何想法，即使是相同的直接在HTML中创建的链接？

Answer 1

如果我理解您的问题...尝试更改您的点击事件处理程序委派。

jQuery('.tabs').on('click', ' .tab-links a', function(e) {

的.tab-links不存在，当您最初绑定的事件处理程序，所以你需要将它委托给其父.tabs 参考：http://api.jquery.com/on/#direct-and-delegated-events