我编写了一个简单的Greasemonkey脚本,我正在尝试为此脚本创建一个“配置”页面(就像用于Google Chrome扩展程序的那样)。是否有任何方法可以创建配置页面对于用户说明,例如Google Chrome扩展程序的“选项”页面?没有任何方法可以将.html页面作为Greasemonkey脚本的一部分包含在内(据我所知),所以我正在寻找其他选项。
// ==UserScript==
// @name Redirector
// @namespace http://use.i.E.your.homepage/
// @version 0.1
// @description enter something useful
// @match http://*/*
// @copyright 2012+, You
// @run-at document-start
// ==/UserScript==
redirectToPage("http://www.youtube.com/", "http://www.google.com");
function redirectToPage(page1, page2){
if(window.location.href.indexOf(page1) != -1){
window.location.href = page2;
}
}
答案 0 :(得分:13)
有一些库为用户脚本提供配置页面:
每个库的使用情况各不相同,但通常会授予他们所需的权限,例如GM_getValue
和GM_setValue
,并通过@require
指令要求库,例如:
// ==UserScript==
// @name My Userscript
// @description An example userscript with a config page
// @version 0.0.1
// @require https://www.example.com/lib/myconfig.js
// @grant GM_getValue
// @grant GM_setValue
// @grant GM_addStyle
// @grant GM_registerMenuCommand
// ==/UserScript==
var config = new MyConfig({ ... })
然后注册一个菜单命令,打开配置页/对话框,例如:
GM_registerMenuCommand('Configure My Userscript!', function () {
config.open()
})
对于MonkeyConfig,它可以为您注册命令:
var config = new MonkeyConfig({
title: 'Configure My Userscript!',
menuCommand: true,
// ...
})
对于高级用途,配置程序可以允许为关闭/取消/保存按钮提供callbacks,以及提供对CSS和其他选项的控制。详细说明可在GM_config wiki和MonkeyConfig homepage上找到。
答案 1 :(得分:6)
如果你将它用于镀铬,那么它不是Greasemonkey而是Tampermonkey。
您可以考虑使用GM_getResourceText,将您的html粘贴到pastebin.com(或类似),并将链接作为@resource之一添加到元数据块。 至少,我知道它适用于Greasemonkey。
例如:
// @resource configHtml http://pastebin.com/raw.php?i=2RjKfwJQ
// ... some DOM node that you will append to the current page
node.innerHTML = GM_getResourceText("configHtml");
答案 2 :(得分:3)
将参数用于您已经包含的页面,如果已设置,则清除整个文档: http://page.my.script.runs.on/?configPage=true
if(getUrlParameter("configPage") === "true") {
$(document).empty
}
答案 3 :(得分:0)
这是非常需要的,但目前两种方法的组合应该有效。
1)对于个人用途,我在脚本的顶部只有一堆变量。这里的问题是,如果其他人使用我的脚本,更新最终会消除他的偏好。
2)在您的网站上有一个配置页面。虽然这非常有效,但网站会一直被删除。脚本没有充分理由依赖网站来运作。
如果您同时执行这两项操作,则当脚本网站消失时,用户可以编辑脚本中的首选项。
以下是//注释掉了不需要的功能的示例。
http://go-here.nl/gm/wikipedia-clean-up.php
祝你好运,享受
答案 4 :(得分:0)
此用户脚本不使用任何外部库。经过修改,您可以制作出良好的用户界面。
// ==UserScript==
// @name UI development
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author ManojBhakarPCM
// @match https://www.google.com/
// @grant none
// ==/UserScript==
(function() {
'use strict';
function ui_create(contentss){
var div = document.createElement('div');
//var contentss = "<h1>TESTsssss</h1>";
div.innerHTML = '<div id="mbpcm_modal" style="position: fixed;z-index: 1;left: 0;top: 0;width: 100%;height: 100%;overflow: auto;display:none;"><div id="mbpcm_content" style="background-color: pink;margin: 15% auto;padding: 20px;border: 1px solid black;width: 20%;box-shadow:20px 20px 30px 2px gray;border-radius:7px;"><span id="mbpcm_close" style="float: right;font-size:25px;cursor: pointer;">×</span>'+ contentss +'</div></div>';
document.body.appendChild(div);
var modal = document.getElementById("mbpcm_modal");
var close = document.getElementById("mbpcm_close");
close.onclick = function(){modal.style.display = "none";}
}
function ui_add_opener(parent,classs,stylee){
var btn = document.createElement("button");
btn.setAttribute("class",classs);
btn.setAttribute("style",stylee);
btn.setAttribute("id","mbpcm_ui_opener");
btn.innerHTML = "Settings";
parent.appendChild(btn);
var modal = document.getElementById("mbpcm_modal");
var btnn = document.getElementById("mbpcm_ui_opener");
btnn.onclick = function(){modal.style.display = "block";}
}
function ui_addElement(el,cls,styl,val,innerHtml){
var modal = document.getElementById("mbpcm_content");
var e = document.createElement(el);
e.setAttribute("class",cls);
e.setAttribute("style",styl);
e.setAttribute("value",val);
e.innerHTML = innerHtml;
modal.appendChild(e);
return e;
}
ui_create("<h1>Title</h1><span>discription</span><br>");
ui_add_opener(document.getElementById("gbw"),"RNmpXc","nothing");
ui_addElement("button","modal","none","none","TestButton").onclick = function(){alert("hellow ji ");}
ui_addElement("br","","","","");
ui_addElement("button","none","none","none","TestButton").onclick = function(){alert("How are you");}
ui_addElement("button","none","none","none","TestButton").onclick = function(){alert("Kaise ho");}
})();