Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Zmiana tresci inputa=zmiana koloru diva
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
3miel
Witam,

mam taki kod:
Kod
document.getElementById('borderdiv').style.background = document.getElementById('border').value;"

i działa dobra, tylko jak zrobić, żeby automatycznie wykrywalo kiedy następuje zmiana w polu input? I gdy nastąpi ta zmiana to ma sie wykonac ten kod.

Mozecie mi pomoc?
batman
Zrób takie coś:

  1. <script type="text/javascript">
  2. function zmien_kolor() {
  3. document.getElementById('borderdiv').style.background = document.getElementById('border').value;"
  4. }
  5. <imput type="text" id="border" name="border" onkeyup="zmien_kolor();" />


Zamiast onkeyup możesz użyć onchange. Pamiętaj jednak, że onchange wykona się dopiero, gdy opuścisz pole tekstowe.

P.S.
Pamiętaj, by w funkcji zmien_kolor() sprawdzać, czy to co jest w wpisane, jest kolorem.
3miel
Niesety ni edziala tak jak nalezy, a to dlatego że korzystam ze skryptu palety koloró (colorPicker2). Dopiero gdy ręcznie wprowadze zmiany to zmienia sie kolor

Próbowałem edytować skrypt ColorPicker2, ale niestety na stronie mam kilka takich palet i nie potrafie wprowadzic zmiannej pomocniczej z nazwa inputa:/

Jezeli ktos sie zna to bylbym wdzieczny za pomoc. Już wiem co i gdzie zedytowac, ale nie potrafie wprowadzic do opowiedniej funkci dodatkowej zmiannej:/

a moze bedzie mogli cos doradzic...
to jest taka funkcja:
Kod
function ColorPicker_highlightColor(c) {

var thedoc = (arguments.length>1)?arguments[1]:window.document;
var d = thedoc.getElementById("colorPickerSelectedColor");
d.style.backgroundColor = c;
d = thedoc.getElementById("colorPickerSelectedColorValue");
d.innerHTML = c;

// var zmienna='border' + 'div';
// document.getElementById(zmienna).style.background = c;

}

// ///////i wywołanie:
var mo = 'onMouseOver="'+windowRef+'ColorPicker_highlightColor(\''+colors[i]+'\',window.document)"';


jak do tej funkcji dodać dodatkową zmienna? próbuje ale nic nie wychodzi (wogole skrypt nie chce działać)
batman
1. Co zawiera zmienna c?

2. Sprawdź czy to pomoże:
Kod
document.getElementById(zmienna).style.backgroundColor = c;
3miel
zmienna C zawiera kolor wygenerowany, natomiast to nie ma nic wspolnego...

zrobilem troche inaczej i teraz tylko nie umiem sobie poradzic z jednym, jak zrobic zeby zmienna miala zasieg globalny?


-----------EDIT---------
lub jak przekazac jedna zmienna ( poprzez onclick) do pliku ze skryptem JS (colorpicker2.js)? Tylko to mi jest potrzebne bo reszta jest gotowa...
batman
Jeśli chcesz, by zmienna była globalna, zdefiniuj ją poza ciałem funkcji:

Kod
var zmiena_globalna;

function cos() {
    // ...
}

function cos2() {
    // ...
}
// ...


Przekazanie zmiennej do skryptu po wykryciu zdarzenia onclick.
Musisz zmienić funkcję tak, by przyjmowała dodatkowy argument (ewentualnie odwołać się to obiektu arguments - ale to już inna historia winksmiley.jpg ). Następnie w elemencie, w którym masz zdefiniowane zdarzenie onclick, przypisujesz odpowiednią funkcję z dodatkowym parametrem.


Cytat
zmienna C zawiera kolor wygenerowany, natomiast to nie ma nic wspolnego...

To może mieć dużo wspólnego, ponieważ zmiana koloru w stylach przy pomocy JS nie zawsze jest możliwa. Głównie dlatego, że kolor jest źle zadeklarowany.
3miel
Tzn powiem tak, ta zmienna przekazuje sie w onClick, ale niestety tylko do jednej funkcji. i chodzi mi o to, żeby ta zianna ktora jest widoczna tylko w tej jednej funkcji była zmienną globalna.

Próbowałem tak robić z dodatkową funckcja w onClick, ale jakos mi to nie wychodzilo, wowole stracilem orientacje jak co i gdzie sie bedzie przekazywac:/ Mozecie podac jakis prosty przyklad? Bo albo ja nie rozumiem na czym to polega albo to nie dziala.

Co do koloru to dziala tak jak powinno, ustawilem recznie do ktorego diva ma sie odwolac ta zmiana koloru i wszystko jest wpożądku.

Zalezy mi na tym jak przekazac ta dodatkową zmienną, lub jak uczynić jakś zmiennę w funckcji żeby miała zasięg globalny.

--------------EDIT-----------
Przedstawię to na przykładzie:

Najpierw wywołuje tak ta funkcje:
Kod
onClick="cp2.select(document.forms[0].border,\'pick2\');return false;"

w head mam taki urywek kodu:
Kod
cp2 = new ColorPicker();

a sam kod ColorPicker wyglada tak:
Kod
function ColorPicker() {
    var windowMode = false;
    // Create a new PopupWindow object
    if (arguments.length==0) {
        var divname = "colorPickerDiv";
        }
    else if (arguments[0] == "window") {
        var divname = '';
        windowMode = true;
        }
    else {
        var divname = arguments[0];
        }
    
    if (divname != "") {
        var cp = new PopupWindow(divname);
        }
    else {
        var cp = new PopupWindow();
        cp.setSize(225,250);
        }

    // Object variables
    cp.currentValue = "#FFFFFF";
    
    // Method Mappings
    cp.writeDiv = ColorPicker_writeDiv;
    cp.highlightColor = ColorPicker_highlightColor;
    cp.show = ColorPicker_show;
    cp.select = ColorPicker_select;   // <--- ten element!

i ta metoda COLORPicker_select:
Kod
function ColorPicker_select(inputobj,linkname) {
    if (inputobj.type!="text" && inputobj.type!="hidden" && inputobj.type!="textarea") {
        alert("colorpicker.select: Input object passed is not a valid form input object");
        window.ColorPicker_targetInput=null;
        return;
        }
    window.ColorPicker_targetInput = inputobj;
    this.show(linkname);
    }


I na moje rozumowanie, funkcja ColorPicker_select jest metoda klasy ColorPicker i w jaki sposób przekazać argument z funkcji ColorPicker_select o nazwie linkname do zmiennej ABC, żeby była widoczna w klasie ColorPicker?

--------------EDIT 2 ------------
sprawa rozwiązana, sam wpadłem na rozwiązanie:)
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.