Javascript 如何为Greasemonkey脚本创建切换按钮?
因此,我试图找出如何为运行并导航到各种页面的greasemonkey扩展创建一个切换按钮 这就是我目前所知道的Javascript 如何为Greasemonkey脚本创建切换按钮?,javascript,button,greasemonkey,Javascript,Button,Greasemonkey,因此,我试图找出如何为运行并导航到各种页面的greasemonkey扩展创建一个切换按钮 这就是我目前所知道的 var keepgoing = true if语句的开头和这里的内容 按钮点击: if keepgoing == true { keepgoing = false } else if keepgoing == false { keepgoing = true } 所以基本上我需要帮助,在网页上放一个按钮。 它需要在浏览页面时记住var 谢谢,Ray如果你想要一个持久按钮或任何数
var keepgoing = true
if语句的开头和这里的内容
按钮点击:
if keepgoing == true { keepgoing = false }
else if keepgoing == false { keepgoing = true }
所以基本上我需要帮助,在网页上放一个按钮。
它需要在浏览页面时记住var
谢谢,Ray如果你想要一个持久按钮或任何数据,你需要使用某种存储。如果涉及多个域,请使用。如果所有内容都在同一个域上,请使用 我自己添加了这种持久化按钮,下面是一个精简的脚本,显示了我使用的内容。在我看来,它不仅仅是添加了一个按钮,它还使按钮用户界面更加友好 注: 按钮状态在页面加载和站点之间持续存在。 该按钮停留在CSS设置的左上角,在未鼠标悬停时淡入不透明状态。 我使用一个对象,因为我有时会在页面中添加多个控件。 你可以。只是这些值不能在演示中跨页面加载持久化。他们在通用汽车的脚本中这样做。
实际上,任何创建设置页面以便我可以更改变量的方法都是可行的,它不必是一个按钮。
if keepgoing == true { keepgoing = false }
else if keepgoing == false { keepgoing = true }
// ==UserScript==
// @name _Keep going button
// @include http://YOUR_SERVER_1.COM/YOUR_PATH/*
// @include http://YOUR_SERVER_2.COM/YOUR_PATH/*
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// ==/UserScript==
//--- Add the button.
$("body").append (
'<div class="gmPersistentButton">'
+ '<button id="gmContinueBtn">Init failed!</button></div>'
);
//--- Define and init the matching control object:
var btnControl = new PersistentButton (
"gmContinueBtn", //-- HTML id
"StopContinueBtn", //-- Storage label
["Stop", "Continue"], //-- Text that the button cycles through
[false, true] //-- Matching values for the button's states
);
//--- Activate the button click-handler.
$("#gmContinueBtn").click ( function () {
var btnValue = this.value;
keepgoing = btnValue
btnControl.SetNextValue ();
if (keepgoing == "true") {
// CALL YOUR FUNCTION HERE.
}
} );
//--- The button will fade when we aren't using it.
var zDisplayPanel = $('div.gmPersistentButton');
zDisplayPanel.hover (
function () { $(this).stop (true, false).fadeTo (50, 1 ); },
function () { $(this).stop (true, false).fadeTo (900, 0.1); }
);
zDisplayPanel.fadeTo (2900, 0.1);
//--- CSS styles to make it work and to improve appearance.
GM_addStyle ( (<><![CDATA[
.gmPersistentButton {
background: orange;
color: black;
position: fixed;
top: 1em;
right: 1em;
z-index: 6666;
padding: 1em;
border: 3px double gray;
border-radius: 1ex;
opacity: 0.8;
}
.gmPersistentButton button {
cursor: pointer;
}
.gmPersistentButton button:hover {
color: red;
}
]]></>).toString () );
//--- Button object
function PersistentButton (htmlID, setValName, textArry, valueArry) {
//--- Initialize the button to last stored value or default.
var buttonValue = valueArry[0];
fetchValue ();
storeValue (); //-- Store, in case it wasn't already.
setButtonTextAndVal ();
//--- DONE with init. Set click and keyboard listeners externally.
//***** Public functions:
this.Reset = function () {
buttonValue = valueArry[0];
storeValue ();
setButtonTextAndVal ();
};
this.SetNextValue = function () {
var numValues = valueArry.length;
var valIndex = 0;
for (var J = numValues - 1; J >= 0; --J) {
if (buttonValue == valueArry[J]) {
valIndex = J;
break;
}
}
valIndex++;
if (valIndex >= numValues)
valIndex = 0;
buttonValue = valueArry[valIndex];
storeValue ();
setButtonTextAndVal ();
};
//***** Private functions:
function fetchValue () {
buttonValue = GM_getValue (setValName, buttonValue);
}
function storeValue () {
GM_setValue (setValName, buttonValue);
}
function setButtonTextAndVal () {
var buttonText = "*ERROR!*";
for (var J = valueArry.length - 1; J >= 0; --J) {
if (buttonValue == valueArry[J]) {
buttonText = textArry[J];
break;
}
}
var theBtn = document.getElementById (htmlID);
if (theBtn) {
theBtn.textContent = buttonText;
theBtn.setAttribute ("value", buttonValue);
}
else
alert ('Missing persistent button with ID: ' + htmlID + '!');
}
}