Question

function createListItem(text1) {
    var link = document.createElement("a");
    var text = text1;
    link.setAttribute("name", text);
    link.setAttribute("href", "javascript:updateLevel1(text)");
    //link.setAttribute("onclick", "updateLevel1()");
    var list_item = document.createElement("li");
    var list_text = document.createTextNode(text);
    list_item.appendChild(list_text);
    link.appendChild(list_item);
    return link;
}

function updateLevel1(text) {
    clearNavFrame2();
    var link = document.createElement("a");
    link.setAttribute("name", text);
    link.setAttribute("href", "javascript:updateLevel1(text)");
    link.appendChild(document.createTextNode(text));
    document.getElementById("navigation_frame1").appendChild(link);
}

这里我想在动态创建HTML链接时将对象文本传递给函数updateLevel1，但遗憾的是上面的代码无效。函数updateLevel1无法找出对象文本。我做错了吗？

Answer 1

是的，你做错了什么。首先，您可以为元素添加“click”处理程序，而不是设置“href”属性：

var link = document.createElement('a');
link.onclick = function() { updateLevel1(text); };

在这种情况下，没有理由使用“javascript：”网址。

现在，您遇到的另一个问题是您创建了<a>元素，但是您没有将其附加到文档中（在您发布的代码中）。我想在某处，你使用“createListItem（）”函数的返回值然后追加它。如果没有，那么，什么都不会发生。

“href”的“javascript：”值不起作用的原因是您正在设置一种情况，即当单击<a>时，浏览器将从该字符串创建一个函数。那时，该函数的局部变量“text”早已消失。但是，当您使用绑定到<a>的“onclick”属性的实际函数引用时，您的函数将在其闭包中保留对该变量的访问权。

Answer 2

只需使用事件处理程序：

function createListItem(text1) {
    var link = document.createElement("a");
    var text = text1;
    link.setAttribute("name", text);
    link.setAttribute("href", "#");

    link.onclick = function(){
    updateLevel1( text );
    return false;
    };

    var list_item = document.createElement("li");
    var list_text = document.createTextNode(text);
    list_item.appendChild(list_text);
    link.appendChild(list_item);
    return link;
}

function updateLevel1(text) {
    clearNavFrame2();
    var link = document.createElement("a");
    link.setAttribute("name", text);

        link.onclick = function(){
        updateLevel1( text );
        return false;
        };
    link.setAttribute("href", "#" );
    link.appendChild(document.createTextNode(text));
    document.getElementById("navigation_frame1").appendChild(link);
}

Answer 3

您需要打破字符串并按字面插入值文本。

link.setAttribute("href", "javascript:updateLevel1('" + text + "')");

小心 - 如果文字包含任何单引号，您可能需要清理文字。

如果有这种可能性，您可能希望运行类似text = text.replace("'", "\\'");

的内容

Answer 4

尝试link.setAttribute("href", "javascript:updateLevel1(this);

然后你通过它的参考在你的函数内部阅读它。例如：

function updateLevel1(elm) {
    clearNavFrame2();
    var link = document.createElement("a");
    link.setAttribute("name", elm.name);  
    ...
}

如何从HTML href链接将对象传递给javascript函数？

4 个答案: