javascript - kako zaustaviti osvježavanje roditeljske stranice dok je dijete prozor otvoren?

Kada kliknem na link da otvorim podprozor, roditeljska stranica se automatski osvježava. Kako to mogu zaustaviti?

roditeljska stranica ne bi trebala osvježavati dok je dijete prozor otvoren. kako to učiniti? molim pomoć.

moj kod je naveden kao u nastavku:

<html>
<head>
<title>login</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script type="text/javascript">
var popup;
function ShowPopup(url) {
if(popup)
    {
     popup.close();
     }
    popup = window.open(url, "self", "toolbar=no,scrollbars=yes,location=no,statusbar=no,menubar=no,resizable=0,width=300,height=350,left = 0,top = 0");
        popup.focus();
 }
</script>

</head>

<body>
<a href="" onclick="ShowPopup('popup_login.asp')" style="color: #1686CC;">Sign In / Register</a>
</body>
</html>

Odgovor #1

Vaša stranica se osvježava jer se ne samo da se vaša funkcija poziva, već se izvršava i hiperveza označena a oznakom. Dakle, imate dvije stvari koje se događaju istovremeno:

  • sam hiperveza vodi na ono što se nalazi u atributu href, čak i ako je prazan. Ako je href prazan, to znači: ponovno učitaj ovu stranicu.
  • Obrada događaja onclick također radi nešto (otvara skočni prozor), ali trenutno ne otkazuje prvi efekt.

U prvoj reakciji moglo bi se jednostavno ukloniti problematični href atribut. Time se rješava problem, ali se uvodi drugi: gubite sav lijepi stil na prikazanom tekstu hiperveze (poput podcrtavanja, boje, promjene kursora, reda tabulatora, ...), što općenito nije ono što želite.

Evo nekoliko praktičnijih rješenja:

Neka onclick rukovatelj događajem vrati false

Vraćanje false poništit će zadano ponašanje veze, a sadržaj atributa href bit će zanemaren:

onclick="ShowPopup('popup_login.asp'); return false;"

Ako vam je stalo do preglednika koji nemaju podršku za JavaScript (ili je imaju onemogućenu), tada stavite smisleni rezervni url u atribut href, poput:

href="javascript_is_required.html"

Koristite event.preventDefault

Ovo je alternativa za return false. Ima prednost što ga možete izvršiti kao prvu naredbu, tako da, ako se dogodi pogreška u drugim dijelovima koda, već će obaviti svoj posao:

onclick="event.preventDefault();ShowPopup('popup_login.asp');"

Imajte na umu da je ovaj event objekt definiran od strane svih preglednika u kontekstu atributa događaja, i da se razlikuje od window.event objekta, koji nije podržan od strane svih preglednika.

Koristite hash notaciju u href

Dajte sidru ime, a zatim to ime referencirajte u atributu href. Na taj način će se sidro pomaknuti u prikaz, što je obično već slučaj kada ga korisnik klikne:

name="loginlink" href="#loginlink"

Često ćete vidjeti kraću varijaciju href="#", ali to će pomaknuti stranicu na vrh kada se klikne, što može biti u redu ako ste sigurni da stranica nije pomaknuta prema dolje. Ipak, upotreba "#" ima nuspojavu: kada se klikne, url se mijenja i prethodni url se stavlja na povijest preglednika. Dakle, ako nakon klika na link pritisnete gumb za povratak, ostajete na stranici. To može biti nepoželjno.

Upotrijebite javascript: protokol za ništa

href="javascript:"

Ovo će učiniti da hiperlink izvrši bilo koji JavaScript koji slijedi nakon dvotočke, a budući da ga tamo nema, ništa se neće dogoditi. Povijest preglednika se ne mijenja. Postoje varijacije ovog metoda, poput javascript: return false; ili javascript: void(0);

Upotrijebite javascript: protokol za rukovanje click događajem

S ovim rješenjem više ne koristite atribut onclick. Umjesto toga, kod premještate u atribut href:

href="javascript: ShowPopup('popup_login.asp');"

Odvajanje izgleda i koda

Izvorni kod i sva gore navedena rješenja još uvijek imaju problem koji mnogim programerima ne odgovara: HTML je pomiješan s javascript kodom. Bolje je odvojiti ta dva.

Ovo se može učiniti na sljedeći način:

<a href="javascript_is_required.html" id="loginLink"
   title="Click here to log on"> ... </a>
...
<script>
    document.getElementById('mylink').onclick = function(e) {
        e = e || event; // cross-browser way to get event object
        e.preventDefault(); // cancel the default click behaviour
        ShowPopup('popup_login.asp'); // your custom code comes here
        return false; // cancel the default click behaviour
    };
</script>

Nekolicina će reći da ovo također ima svoju lošu stranu: teže je identificirati kod koji se izvršava na klik. Gornji kod će priključiti rukovatelja događajem na click događaj elementa mylink. Pazite da se izvrši tek nakon što je dokument učitan. Rukovatelj događajem otkazuje zadano ponašanje klika na dva načina. Odaberite onaj koji vam više odgovara, ili oba ako želite. Budući da je otkazano, navigacija do vrijednosti href atributa nikada se ne izvršava. Prvi redak rješava specifičnosti preglednika budući da stariji IE preglednici ne prosljeđuju objekt događaja kao argument rukovatelju događajem, već izlažu globalni event objekt.

Ako ne morate podržavati preglednike starije od IE9, možete dodatno poboljšati koristeći addEventListener('click', myfunction); umjesto onclick=myfunction; u gore navedenom kodu. To ima mnoge prednosti: više upravitelja događaja može biti pridruženo istom događaju, a također ih možete ukloniti jedan po jedan. jQuery nudi dobru podršku za različite preglednike za ovo s .on().

Postoji nekoliko varijacija gore navedenih rješenja, sve s vlastitim prednostima i nedostacima. Čak biste mogli odustati od korištenja sidra u tu svrhu i umjesto toga koristiti neki drugi element s dodanim stilovima.

Odgovor #2

Napišite return false(); nakon JS metode window.open().

U slučaju da gornji isječak ne radi, promijenite zadanu <button> oznaku u normalnu <input> oznaku s type="button". To će riješiti problem.

Ispod je isječak koda:

JavaScript

<script>
  function tagedlist() { 
    window.open("http://w3schools.com","mywindow","menubar=1,resizable=1,width=1000,height=1000");
    return false;           
  }
</script>