Question

使用JS书签在Wordpress编辑帖子屏幕中设置自定义字段。将以下代码复制/粘贴到控制台（最新的Chrome稳定版）时，以下代码效果很好：

document.getElementById('metakeyselect').value = "foo";
document.getElementById('metavalue').value = "bar";
document.getElementById('meta-add-submit').click();

顺利工作;我将其粘贴到控制台中，并在帖子中添加了一个新的自定义var（我已经将“foo”作为WP中的var名称）。

在bookmarklet表单中，相同的代码如下所示：

javascript:document.getElementById('metakeyselect').value = "foo";document.getElementById('metavalue').value = "bar";document.getElementById('meta-add-submit').click();

它失败了：当我点击它时，会填写名称和值框，但不会提交任何内容。控制台显示以下错误：

Uncaught TypeError: Cannot call method 'click' of null

知道为什么吗？相同的代码，相同的浏览器，相同的页面。

Answer 1

我遇到了类似的问题，并且非常确定这也是导致您的代码损坏的原因。我的最小示例是此网站上的以下代码（应该在整个stackoverflow.com域中都适用）：

document.getElementsByName("q")[0].value="foo";

这应该在搜索字段中写入“ foo”（没有ID，但是唯一名为“ q”的元素）。 Web控制台和小书签都将按预期设置值，但小书签也会在短暂的延迟后将页面更改为空标题和仅包含单词“ foo”的正文。假设这不是一个仅适用于我的随机错误，那么在您的示例中引发异常的原因是，bookmarklet将值设置为“ foo”，然后设置为“ bar”，但将网页的内容更改为“ foo” ，然后在最后一行终止之前按“ bar”。

不幸的是，我不知道这种行为的原因（我发现这个问题是在寻找确切的信息），但这很可能导致示例中的TypeError。

在Greasemonkey脚本（例如，使用Greasemonkey添加的按钮的onclick脚本）中使用时，相同的代码运行时可能没有任何问题。

Answer 2

您在控制台中使用的代码看起来正常。

似乎将控制台代码转换为书签的方法可能会导致错误。

基本的 IIFE构造，即立即调用函数表达式，如下所示：

javascript:(function () {
    /*code here*/
})();

因此，应该起作用的代码可能是这样。

javascript:(function () {
    document.getElementById('metakeyselect').value = "foo";
    document.getElementById('metavalue').value = "bar";
    document.getElementById('meta-add-submit').click();
})();

它可以解决您的问题吗？

JS bookmarklet问题：代码在控制台中工作，在bookmarklet中失败

2 个答案: