亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

JavaScript - 我的復選框(默認情況下處于選中狀態)不會在頁面加載時運行其腳本

JavaScript - 我的復選框(默認情況下處于選中狀態)不會在頁面加載時運行其腳本

慕森卡 2023-10-14 10:00:52
如果這真的很簡單,我很抱歉,但我對 JavaScript 還比較陌生。我已經在網上尋找解決方案,但沒有找到任何東西!因此,我正在為 Google Chrome 擴展彈出窗口構建一種“設置”UI,并使用復選框來啟用/禁用選項。我希望默認選中其中一個復選框,因此我checked在其 HTML 中定義了該屬性,如下所示;<input type="checkbox" id="option1" style="margin-left: 20px;" checked>                                                        <!-- ^ Right here ^ --><script src="script.js"></script>我在這里實現了一個腳本,這樣如果選中該復選框,就會以編程方式注入某個腳本。如果不檢查,它將注入不同的腳本。代碼:document.getElementById("option1").addEventListener("click", toggleOption1);function toggleOption1() {  var option1 = document.getElementById("option1");  // if option1 is checked, run first script  if (option1.checked === true) {    chrome.tabs.executeScript({          file: 'optionEnabled.js'        });  // otherwise, run script 2  } else {    chrome.tabs.executeScript({          file: 'optionDisabled.js'        });    }}現在,到目前為止,這對我來說效果很好,它完全按照它的預期去做,除了一件事:我希望代碼自動運行,因為,呃,默認情況下會選中該復選框。該代碼僅識別用戶取消選中或選中該框的情況。注意:我知道這行代碼document.getElementById("option1").addEventListener("click", toggleOption1);意味著該函數是在單擊時運行的,我應該使用onclick="toggleOption1()"它,但因為我正在制作 chrome 擴展,所以不允許使用內聯腳本。注2:如果解決方案可以避免 JQuery 或其他外部庫,我將不勝感激,但如果沒有其他可用的,我想也沒關系!注3:我會提供一個JSFiddle,但我不相信有辦法實現chrome擴展環境。那里有人知道解決這個問題的方法嗎?我已經困惑了好幾天了,我真的很想解決這個問題。提前致謝!
查看完整描述

2 回答

?
至尊寶的傳說

TA貢獻1789條經驗 獲得超10個贊

稱呼


   toggleOption1();


    document.getElementById("option1").addEventListener("click", toggleOption1);

編輯


您應該使用 DOMContentsLoaded 事件之類的東西來確保加載數據對象模型


JavaScript


    window.addEventListener('DOMContentLoaded', (event) => {

        

   

      

      document.getElementById("option1").addEventListener("click", toggleOption1);

       toggleOption1();

  });

function toggleOption1() {


  var option1 = document.getElementById("option1");


  // if option1 is checked, run first script

  if (option1.checked === true) {

    console.log("checked");

    // chrome.tabs.executeScript({

    //       file: 'optionEnabled.js'

    //     });

  // otherwise, run script 2

  } else {

    console.log("not checked");

    // chrome.tabs.executeScript({

    //       file: 'optionDisabled.js'

    //     });

    }

}


查看完整回答
反對 回復 2023-10-14
?
墨色風雨

TA貢獻1853條經驗 獲得超6個贊

由于您知道默認情況下復選框已選中,因此您可以簡單地從后臺腳本而不是彈出腳本執行代碼 chrome.tabs.executeScript 。

加載擴展后,就會加載后臺腳本。后臺腳本對于所有選項卡都有一個實例。

更新: 加載擴展時只會執行一次。因此,用戶在彈出窗口之后使用復選框是沒有問題的


查看完整回答
反對 回復 2023-10-14
  • 2 回答
  • 0 關注
  • 158 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號