-1

这是我昨天问的一个问题的后续。

我有一个用户脚本（有点像 GreaseMonkey 脚本，但适用于 Chrome）。

这个想法是在页面上添加一个文本框和一个按钮。然后，当用户单击按钮时，它会启动一个执行操作的函数。所以我将文本框、按钮和函数注入到页面中，但是当用户单击按钮时，Chrome 控制台会告诉我“未捕获的 TypeError：对象不是函数”。所以很明显它没有看到我刚刚注入的函数，它是在onclick按钮的事件中指定的。

所以我有这样的代码：

initialize();

function initialize() { 
    var dropDown = document.getElementById("tstGlobalNavigation_ddlChooseProject"); 

    // add a textbox 
    dropDown.innerHTML = dropDown.innerHTML + "&nbsp;&nbsp;&nbsp;<input type='text' name='txtSearch' style='position:absolute;top:8px;left:800px;width:50px' >";

    // add a button 
    dropDown.innerHTML = dropDown.innerHTML + "&nbsp;&nbsp;&nbsp;<input type='button' name='btnSearch' value='Go' onclick='fn()' style='position:absolute;top:8px;left:860px;width:35px'>";

    addScript("var obj = document.getElementById('txtSearch'); " 
    + "if (obj != null) { " 
    + " var incidentId = document.getElementById('txtSearch').value; " 
    + " var currentURL = location.href; " 
    + " var splitResult = currentURL.split('/'); " 
    + " var projectId = splitResult[4]; " 
    + " location.href = 'http://dev.myApp.com/ProductTeam/' + projectId + '/Incident/' + incidentId + '.aspx'; " 
    + " }" 
    , "fn"); 
}

function addScript(contents, id) { 
    var head, script; 
    head = document.getElementsByTagName('head')[0]; 
    script = document.getElementById(id); 
    if(script != undefined) { 
    head.removeChild(script); 
    } 
    script = document.createElement('script'); 
    script.type = 'text/javascript'; 
    script.id = id; 
    script.innerHTML = contents; 
    head.appendChild(script); 
}

我在这里想念什么？

4

3 回答 3

2

您没有调用您创建的函数，而是使用了您提供给脚本标签的 id ...尝试将代码更改为

addScript("function fn() { var obj = document.getElementById('txtSearch'); " 
    + "if (obj != null) { " 
    + " var incidentId = document.getElementById('txtSearch').value; " 
    + " var currentURL = location.href; " 
    + " var splitResult = currentURL.split('/'); " 
    + " var projectId = splitResult[4]; " 
    + " location.href = 'http://dev.myApp.com/ProductTeam/' + projectId + '/Incident/' + incidentId + '.aspx'; " 
    + " } }" 
    , "fn");

你将有一个可以调用的 fn() 函数

于 2011-04-07T22:00:23.903 回答
1

问题是您正在尝试使用onclickelement 属性来绑定事件处理程序。这些属性仅在第一次加载页面时解析，此时您尝试绑定为回调的函数不存在。

on*尽可能避免在元素属性中绑定事件处理程序。这称为编写不显眼的 JavaScript。

也就是说，如果您绝对必须坚持使用 using onclick，您可以绑定到一个虚拟函数，该函数除了转身并调用您注入的函数之外什么都不做：

<button onclick="wrapper()"

哪里wrapper看起来像这样：

function wrapper() {
    return functionThatWillEventuallyBeInjected();
}
于 2011-04-07T21:54:02.497 回答
-1

我不确定您实际上是否可以动态创建script标签并在其中推送内容。

您可以改为创建脚本标签并将 src 属性修改为某个 JS 文件：

var script = document.createElement("script");
script.type = "text/javascript";
script.src = "path/to/your/javascript.js";
document.body.appendChild(script);

如果您确实需要执行存储在字符串中的代码，也许您可eval()​​以在需要时简单地执行它！

于 2011-04-07T21:52:49.233 回答