Question

我尝试使用链接和一些javascript动态添加div。我已经设置了一个jsfiddle http://jsfiddle.net/W4Sup/1654/。

这里是html

<a href="javascript:addDiv();" onclick="addDiv();">Add Div</a>

这里是css

div {
 border: 1px dotted red;
 padding: 10px;    
}

这是javascript：

var iDiv = document.createElement('div');
iDiv.id = 'block';
iDiv.className = 'block';
document.getElementsByTagName('body')[0].appendChild(iDiv);

iDiv.innerHTML = "I'm the first div";

// Now create and append to iDiv
var innerDiv = document.createElement('div');
innerDiv.className = 'block-2';

// The variable iDiv is still good... Just append to it.
iDiv.appendChild(innerDiv);
innerDiv.innerHTML = "I'm the inner div";

function addDiv() {
    var newDiv = document.createElement('div');
    newDiv.className = 'block-3';
    iDiv.appendChild(newDiv);
    newDiv.innerHTML = "Another inner div";
}

有人可以解释我的错误吗

Answer 1

检查这个更新的fiddle，基本上addDiv对于click事件处理程序是不可见的，因为它不在全局范围内（因为它在domready事件处理程序中）

enum

Answer 2

首先，您不需要href，只有onclick才重要，因此可以在任何html标记上使用，而不仅仅是<a>

<a href="javascript:addDiv();" onclick="addDiv();">Add Div</a>

onclick在你的函数结尾处没有;，它是一个赋值，你不是在调用它

Answer 3

我更喜欢分配JS方法。通过抓取该链接并将addDiv放入其document.getElementById("joe").addEventListener("click", addDiv, false); ... function addDiv( event ) { event.preventDefault(); ... }事件处理程序中，在JS中设置事件侦听器。

Demo using your code

基本变化 -

<强> JS：

<a href="#" id="joe">Add Div</a>

<强> HTML：

private async void F()
{
    button.IsEnabled = false;
    await Task.Delay(1000);
    button.IsEnabled = true;
}

您不必使用ID，这只是此示例中最方便的方式。如果那是你的选择，我推荐它。

使用href链接动态添加div

3 个答案:

Demo using your code