Chrome extensions i js :: 4programmers.net

Rejestracja:około 6 lat
Ostatnio:prawie 4 lata
Postów:34

0

Witam, ponownie mam problem z js. Chcę za pomocą chrome extensions kliknąć przycisk na stronie. Przeczytałem dokumentację i wątki na forach na ten temat, ale niestety nie działa. Js nie umiem zbyt dobrze dlatego piszę tutaj o pomoc, całkiem możliwe, że problem jest bardzo łatwy do rozwiązania.
Mam kilka plików
Manifest.json

Kopiuj

{
    "manifest_version": 2,
    "name": "Button Click",  
    "description": "Be able to press buttons",  
    "version": "1.0",    
    "browser_action": { 
        "default_icon": "icon.png",
        "default_popup": "popup.html"  
    },
    "permissions": ["tabs", "<all_urls>"]
}

popup.html

Kopiuj

<!doctype html>  
<html>  
    <head><title>Fill</title></head>  
    <body>
        <h2 id="htwo">Button presser</h2>
        <button id="press">Go to activity tab</button>  
        <script src="popup.js"></script> 
    </body>
</html>

popup.js

Kopiuj

function injectTheScript() {
    // Gets all tabs that have the specified properties, or all tabs if no properties are specified (in our case we choose current active tab)
    chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
        // Injects JavaScript code into a page
        chrome.tabs.executeScript(tabs[0].id, {file: "utilities.js"});
    });
}
// adding listener to your button in popup window
document.getElementById('press').addEventListener('click', injectTheScript);

utilities.js

Kopiuj

function goToActivityTab() {
    var activityTab = document.getElementsById("wysylka")[0];

    activityTab.click();
}

goToActivityTab();

Chcę aby został naciśnięty przycisk

Kopiuj

<input type="submit" class="button" id="wysylka"name="wysylanie" value="Wyślij podanie" />

Sądzę, że problem leży w pliku utilities.js, ale nie mam pewności. Skrypt nie jest mój, wziąłem go z innego forum i próbowałem przerobić pod kliknięcie tego przycisku.

edytowany 7x, ostatnio: mordkaje 2019-07-23 08:30

Yukiteru Gromadzki 2019-07-23 09:44

Sprawdzałeś czy skrypt utilities.js jest dołączany do strony? Jeżeli nie, kliknij F12 i sprawdź.

mordkaje 2019-07-23 10:11

utilities.js jest dodany ale jak wszedłem tam gdzie powiedziałeś to widzę, że jest tam błąd Uncaught TypeError: document.getElementsById is not a function at goToActivityTab (VM16 utilities.js:5) at VM16 utilities.js:10

JustCuzICan 2019-07-23 11:13

getElementById, a nie getElementsById

Freja Draco

2019-07-23 12:05

~~Freja Draco~~2019-07-23 12:05

Rejestracja:około 7 lat
Ostatnio:ponad 3 lata
Postów:3394

3

Uwag mam kilka:

Czy potrzebujesz czegoś, co ci kliknie obiekt na stronie, czy to tylko taka wprawka w robieniu rozszerzeń do Chroma? Bo jeśli chodzi po prostu o klik, to łatwiej będzie zrobić skryptozakładkę, niż kombinować z rozszerzeniem.
A istnieje w ogóle funkcja getElementsById? Jeśli faktycznie potrzebujesz kolekcji elementów, użyj querySelectorAll.
Niemniej w omawianym przypadku potrzebujesz złapać tylko jeden element, więc w zupełności wystarczy:
var activityTab = document.getElementById("wysylka");
i po tej zmianie twoje rozszerzenie działa.

Dziękuję za uwagę :)

mordkaje 2019-07-23 12:56

To ma być dużo bardziej skomplikowane, a to tylko początek. Bardziej testowo to robiłem, bo w innym moim zapytaniu na forum otrzymałem odpowiedź, że rozszerzeniami mogę zrobić to co potrzebuje. Ale po tej poprawce już działa, dzięki.

mordkaje

2019-07-23 18:10

mordkaje2019-07-23 18:10

Rejestracja:około 6 lat
Ostatnio:prawie 4 lata
Postów:34

0

Freja Draco napisał(a):

Uwag mam kilka:

Czy potrzebujesz czegoś, co ci kliknie obiekt na stronie, czy to tylko taka wprawka w robieniu rozszerzeń do Chroma? Bo jeśli chodzi po prostu o klik, to łatwiej będzie zrobić skryptozakładkę, niż kombinować z rozszerzeniem.

A istnieje w ogóle funkcja getElementsById? Jeśli faktycznie potrzebujesz kolekcji elementów, użyj querySelectorAll.

Niemniej w omawianym przypadku potrzebujesz złapać tylko jeden element, więc w zupełności wystarczy:
var activityTab = document.getElementById("wysylka");
i po tej zmianie twoje rozszerzenie działa.

Dziękuję za uwagę :)

Jeszcze 1 pytanie mam. Trochę ulepszyłem ten skrypt
teraz plik utilities.js wygląda tak:

Kopiuj

 var ilosc_poczatkowa = document.getElementById("ilosc_poczatkowa").value; 
    var ilosc_koncowa = document.getElementById("ilosc_koncowa").value; 
    var sum = 0;
for(i=ilosc_poczatkowa; i<=ilosc_koncowa; i++){
function goToActivityTab() {
    sum +=1;

    var activityTab = document.getElementById(i);
    alert(i);

   activityTab.click();

}

goToActivityTab();
}

Na stronie jest lista osób i do każdej jest przypisane id. Pobierane jest pierwsze i ostatnie id i tworzona jest pętla zaczynająca się od 1 id i trwa aż do ostatniego. Jest jednak jeden problem. Ta lista osób jest odpowiednio filtrowana przez co niektórych id tam brakuje i gdy skrypt trafia na taką sytuacje wyskakuje błąd, ponieważ nie może kliknąć przycisku, którego nie ma. Pytanie brzmi jak rozwiązać ten problem.

Freja Draco

2019-07-23 20:40

~~Freja Draco~~2019-07-23 20:40

Rejestracja:około 7 lat
Ostatnio:ponad 3 lata
Postów:3394

0

Nie używaj osobnych id–ów, tylko nadaj każdemu elementowi klasę, np: class="osoby".
Użyj document.querySelectorAll(".osoby"), żeby zbudować kolekcję elementów danej klasy.
Użyj pętli, żeby przelecieć po wszystkich elementach w kolekcji.

Patrz przykłady:
https://www.w3schools.com/jsref/met_document_queryselectorall.asp