使用javascript更改zIndex

它适用于预制的div，但在新制作的div上，它不起作用。我该如何解决这个问题

以下是更改zIndex事件的代码：

$(".widget").mousedown(function (event) {
    var ws = document.getElementById("widget-workspace");
    var list = ws.children, x=0;

    for(x=0;x<ws.children.length;x++){
        console.log(ws.children[x].id);
        $("#"+ws.children[x].id).css("zIndex", 99);
    }

    $(this).css("zIndex", 100);
});

下面是添加div的代码：

document.getElementById("widget-dialog-button").onclick = function () {
    var ws = document.getElementById("widget-workspace");
    var list = ws.children;
    var x, w = document.getElementById("select-widget");
    var widget = w.options[w.selectedIndex].value;
    var c = document.getElementById("select-widget-color");
    var color = c.options[c.selectedIndex].value;
    var left = 0, top = 25, docWidth = ws.offsetWidth, check;

    for(x=0; x < list.length; x++){
        docWidth -= 325;
        left += 325;
        if(docWidth < 325){
            check = false;
            docWidth = ws.offsetWidth;
            left = 0;
            top += 210;
        }else{
            check = true;
        }
    }

    x-=2;

    var iDiv = document.createElement('div');
    iDiv.id = 'widget_'+x;
    iDiv.className = 'widget';
    iDiv.style.backgroundColor = color;
    iDiv.style.left = left;
    iDiv.style.top = top;
    ws.appendChild(iDiv);

    $(function() {
        $( ".widget" ).draggable();
    });
};

---

如果你们还需要什么，请随意询问。

连接鼠标向下侦听器的方式意味着只会侦听在该点存在的元素。使用on方法：

---

答案很简单：

它适用于预制的div，但在新制作的div上，它不起作用。我该如何解决这个问题

这很正常：

$(".widget").mousedown(...);

// should be read as (except that a new var is not created)
var $currentlyExistingWidgets = $(".widget");
$currentlyExistingWidgets.mousedown(...);

对于当前存在的类widget的每个元素，绑定一个事件

如果要将事件绑定到不存在的元素。。。您必须重新考虑您的思维方式，然后使用事件委派机制和适当的筛选将事件侦听器绑定到始终存在的容器

例如，以下代码应捕获在之前或之后创建的all.widget的事件：

// http://api.jquery.com/on/
$('body').on('mousedown', '.widget', function() { ... });

---

如果您想搜索和学习，关键概念是事件冒泡和事件委派。

什么有效，什么无效？你的代码有什么问题？您想实现什么？使用Jquery“On”函数。。。

// http://api.jquery.com/on/
$('body').on('mousedown', '.widget', function() { ... });