Question

我在我的脚本中创建了一个格式<div>的构造函数，以便可以即时创建和销毁它们。
这是功能：

function formatDiv(target,divId,divClass,content,onclick)
{
    $("#"+target).append("<div id=\'" + divId + "\' class=\'" + divClass + "\' onclick=\'" + onclick + "\'>" + content +"</div>");

}

我一直试图做的是将函数调用作为数组中的字符串传递，例如主菜单的"Main()"，并将其分配给<div>'{{ 1}}属性。这在使用jquery升级我的代码之前工作正常，但现在当我点击onclick=""时，控制台返回：<div>。
假设这是由于包含jquery引起的（因为它仍然在我的旧备份中工作），我决定将构造函数更新为jquery的.click事件处理程序，
导致这个：

ReferenceError: Main is not defined

，我将数组管道信息中要调用的函数的格式更改为从function formatDiv(target,divId,divClass,content,onclick) { $("#"+target).append("<div id=\'" + divId + "\' class=\'" + divClass + "\'>" + content +"</div>"); $("#"+divId).click(function(){$(onclick)}); }到onclick的{{1}}参数。
现在点击"Main()"时，一切都没有发生，没有任何错误或任何错误。

向我的Main添加onclick处理程序的最佳方法是什么？我不正确地使用.click吗？ Jquery对我来说仍然是新手（尽管w3schools课程和jquery网站上的教程），所以我不得不猜测我正在使用它。任何帮助，将不胜感激。

以下是整个剧本：

<div>

Answer 1

如果你想调用一个函数，只需使用functionName()代替$(functionName)，那么就像这样更改你的代码

$(document).ready(function () {
    Main();
    ....
            //display options
            this.contentMenu = function () {
                for (i = 0; i < content.length; i++) {
                    formatDiv("interface", "content" + i, "menuContent", content[i], onclick[i]);
                }
            }
    ....
    //format divs
    function formatDiv(target, divId, divClass, content, onclick) {
        $("#" + target).append("<div id=\'" + divId + "\' class=\'" + divClass + "\'>" + content + "</div>");
        $("#" + divId).click(onclick);
    }

Answer 2

由于你的div是动态创建的，你不能使用.click()绑定，因为它只绑定到脚本运行时已经退出的元素。但是，您可以使用.on()并绑定到页面上的现有元素。最糟糕的情况是像body元素，但你可能会找到一个更靠近div所在位置的元素。

例如：

$("#"+target).append("<div id=\'" + divId + "\' class=\'" + divClass + "\'>" + content +"</div>");
$('body').on('click', "#"+divId, function(){$(onclick)});

来自.on()文档：

事件处理程序仅绑定到当前选定的元素;他们在您的代码调用.on（）时页面上必须存在。要确保元素存在且可以选择，请执行事件绑定在文档就绪处理程序中的元素页面上的HTML标记。如果将新HTML注入页面，选择元素并在新HTML之后附加事件处理程序放入页面。或者，使用委派事件来附加事件处理程序，如下所述。

Answer 3

听起来您正在寻找live()类型的功能。你实际上并不想使用.live（）。 Here is a good answer为什么要实际使用.on()。

Answer 4

让我们从如何使用jquery创建div开始。你制作div的方式是正确的，但不是最有效的。您可以使用以下语法

使用jQuery创建任何html元素

$('<NODE_NAME>')

所以对于div来说，它将是

$('<div>')

既然我们有一个jquery对象，我们需要为它添加属性，我们使用attr方法。我们传递属性名称/值对的对象。

$('<div>').attr({
    className: divClass ,
    id: divId 
});

现在，要在div中添加内容，我们使用.html方法

$('<div>')
.attr({
    className: divClass ,
    id: divId 
})
.html(
    content
);

最后我们添加了onclick处理程序

$('<div>')
.attr({
    className: divClass ,
    id: divId 
})
.html(
    content
)
.click(
    onclick
);

onclick处理程序的错误是将它包装在$（）中。这没有意义，你想调用main函数，而不是将它作为值传递到jquery函数。

尝试使用jquery </divs>提供<divs> onclick功能

4 个答案: