作者orange0319 (喵喵喵)
看板Ajax
標題[問題] 寫了Firefox腳本 但是onclick無法作用
時間Sun Mar 24 23:37:04 2019
就....
學了點皮毛JS
所以就想著寫腳本來解決使用上的一些問題
如果順利也可以分享出來給大家用
想說在某些特定網站上可以新增按鈕並提供轉址及功能
所以建了2個按鈕
myhelpbtn1 和 myhelpbtn2
希望一個按了觸動 toMobio()可以轉址
另一個按了後觸動 myDownload()
可以不跳轉頁面並取得跳轉後的頁面下載位置
並將網頁取得的名稱修改檔案名稱
但碰到幾個問題
1.
在瀏覽器上自己的頁面看兩個按鈕有創造出來
按了toMobio()後，轉的網址組合也如預期
但是上GreaseMonkey到目標網站測試
按鈕有創造出來 但是該網站上無法運行
跳
ReferenceError: toMobio is not defined
請問這是因為onclick被傳說中的 内容安全策略CSP 擋了??還是?
2.
想說在GreaseMonkey無法作用
所以改用TamperMonkey
原碼照貼過去
結果....測試連按鈕都出不來 Q_Q
碼如下
但 myDownload() 還沒寫完...
這程式碼行為感覺不知道是不是我要的
所以想邊測試邊寫...就發現上面說的問題
style設定也佔很多行
但求完整我還是貼...如果傷眼我就砍掉
document.body.onload = addElement;
function addElement () {
let uwthumb = document.querySelector('.uwthumb');
var myhelpbtn1 = document.createElement('div');
myhelpbtn1.className = 'helpbtn1';
myhelpbtn1.style.border='solid';
myhelpbtn1.style.borderColor='#0000FF';
myhelpbtn1.style.display = 'flex';
myhelpbtn1.style.justifyContent = 'center';
myhelpbtn1.style.alignItems = 'center';
myhelpbtn1.style.cursor= 'pointer';
myhelpbtn1.style.width = '120px';
myhelpbtn1.style.height = '35px';
myhelpbtn1.style.margin.top = '4px';
myhelpbtn1.style.backgroundColor='lightblue';
myhelpbtn1.innerHTML = '<a onclick="toMobio();" >手機版網頁</a>';
uwthumb.appendChild(myhelpbtn1);
var myhelpbtn2 = document.createElement('div');
myhelpbtn2.className = 'helpbtn2';
myhelpbtn2.style.border='solid';
myhelpbtn2.style.borderColor='#0000FF';
myhelpbtn2.style.display = 'flex';
myhelpbtn2.style.justifyContent = 'center';
myhelpbtn2.style.alignItems = 'center';
myhelpbtn2.style.cursor= 'pointer';
myhelpbtn2.style.width = '120px';
myhelpbtn2.style.height = '35px';
myhelpbtn2.style.margin.top = '4px';
myhelpbtn2.style.backgroundColor='lightblue';
myhelpbtn2.innerHTML = '<a onclick="myDownload()" >直接下載</a>';
uwthumb.appendChild(myhelpbtn2);
}
const toMobio = ()=>{
str=location.pathname;
str=str.replace(/index/g, "slide");
window.location = "
https://www.aaaaaaaa.org" +str;
}
const myDownload=()=>{
const mydlname= document.querySelector('.userwrap h2').innerText;
str=location.pathname;
str=str.replace(/photos/g, "download");
window.location = "
https://www.aaaaaaaa.org" +str;
const dl_url= document.querySelector('.down_btn').href;
var iframe = document.createElement("iframe");
iframe.href = dl_url;
iframe.download =`${mydlname}.zip`;
iframe.click();
}
以及a了一下文章發現好像現在腳本很難運行
可是....
以前玩ogame / 車肥羊 / Gladiatus 之類遊戲
他們css和腳本都寫超好的
介面也超親切
雖然不會設想自己能一步登天像那些開發者一樣
但是沒想到我連這種初階程式碼都能撞牆 Q_Q
--
「戰爭結束後，我就要回鄉下結婚了」
「可惡！原來是這麼回事！」
「我才不跟可能是兇手的人待在同一地方，我要先回房了」
「先替我保管，等打完這場戰爭之後再還我吧...咦？什麼聲音，我去看看」
「等這一切結束後，我有些話想跟妳說！」
「這段時間我過的很開心」
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 42.73.237.191
※ 文章網址: https://webptt.com/m.aspx?n=bbs/Ajax/M.1553441845.A.CF7.html
1F：→ dododavid006: 油猴會把你的 script 包在一個 closure 裡執行吧 03/24 23:54
2F：→ dododavid006: 若是這樣你就沒辦法直接用 onclick 的方式加事件處 03/24 23:54
3F：→ dododavid006: 理的函式 兩種方式 一種是把你的函式用 03/24 23:55
4F：→ dododavid006: window.myDownload = myDownload 的方式匯到全域去 03/24 23:55
5F：→ dododavid006: 一種是改用 addEventListener 來幫你的按鈕加上去 03/24 23:55
6F：→ tino1991: 看到關鍵字XD 萬神殿不是有了嗎 03/25 14:12
7F：→ orange0319: 感謝樓上大大們的回應 來試試看 03/25 20:21