לאתר זה תהיה פונקציונליות מוגבלת בזמן שאנו מתחזקים אותו לשיפור החוויה שלך. אם מאמר מסויים לא פותר את הבעיה שלך וברצונך לשאול שאלה, קהילת התמיכה שלנו מחכה לעזור לך ב־Twitter תחת ‎@FirefoxSupport וב־Reddit תחת ‎/r/firefox.

יש להימנע מהונאות תמיכה. לעולם לא נבקש ממך להתקשר או לשלוח הודעת טקסט למספר טלפון או לשתף מידע אישי. נא לדווח על כל פעילות חשודה באמצעות באפשרות ״דיווח על שימוש לרעה״.

מידע נוסף

אשכול זה נסגר והועבר לארכיון. נא לשאול שאלה חדשה אם יש לך צורך בעזרה.

javascript using class selectors opens new tab

  • 2 תגובות
  • 1 has this problem
  • 5 views
  • תגובה אחרונה מאת bobjtls

I have a page using javascript to filter div's depending on a selection criteria. On Safari and Chrome, the filtering works just fine. Bit onFirefox (the latest version) instead of seeing the filtered list I see a new tab, titled About:

The attached images show the sequence, screen1 and then screen2 then screen3. I should see screen1 with a subset of the divs in the scrolling section.

The javascript is:

  function TLSshowhide(tlsclassname) {
/* first, hide all responsive div's */
var y = window.frames['theinterviewsdataframe'];
var z = y.document.getElementById('theinterviewsdata');
var x = z.getElementsByClassName('responsive');
            var i;
            for (i = 0; i < x.length; i++) {
                    x[i].style.display = 'none';
             }
/* then, show the responsive div's with the selected classname */
           x = z.getElementsByClassName(tlsclassname);          
           for (i = 0; i < x.length; i++) {
                    x[i].style.display = 'initial';
            }
}
/* When the user clicks on the artist button,  show all responsive div's */
function showArtist() {
/* when showing the artists, show all responsive div's */
var y = window.frames['theinterviewsdataframe'];
var z = y.document.getElementById('theinterviewsdata');
var x = z.getElementsByClassName('responsive');
            var i;
            for (i = 0; i < x.length; i++) {
                    x[i].style.display = 'initial';
             }
}
You can see this in action for yourself by going to http://cultconv.com/CultConv20181030/theinterviews.html and clicking the By Artist button

The list of DIV's being displayed is found in http://cultconv.com/CultConv20181030/theinterviewsdata.html

All help appreciated.

bobj

I have a page using javascript to filter div's depending on a selection criteria. On Safari and Chrome, the filtering works just fine. Bit onFirefox (the latest version) instead of seeing the filtered list I see a new tab, titled About: The attached images show the sequence, screen1 and then screen2 then screen3. I should see screen1 with a subset of the divs in the scrolling section. The javascript is: <pre><nowiki> function TLSshowhide(tlsclassname) { /* first, hide all responsive div's */ var y = window.frames['theinterviewsdataframe']; var z = y.document.getElementById('theinterviewsdata'); var x = z.getElementsByClassName('responsive'); var i; for (i = 0; i < x.length; i++) { x[i].style.display = 'none'; } /* then, show the responsive div's with the selected classname */ x = z.getElementsByClassName(tlsclassname); for (i = 0; i < x.length; i++) { x[i].style.display = 'initial'; } } /* When the user clicks on the artist button, show all responsive div's */ function showArtist() { /* when showing the artists, show all responsive div's */ var y = window.frames['theinterviewsdataframe']; var z = y.document.getElementById('theinterviewsdata'); var x = z.getElementsByClassName('responsive'); var i; for (i = 0; i < x.length; i++) { x[i].style.display = 'initial'; } }</nowiki></pre> You can see this in action for yourself by going to http://cultconv.com/CultConv20181030/theinterviews.html and clicking the By Artist button The list of DIV's being displayed is found in http://cultconv.com/CultConv20181030/theinterviewsdata.html All help appreciated. bobj
צילומי מסך מצורפים

השתנתה ב־ על־ידי cor-el

פתרון נבחר

Hi bobj, why do the links have target="_blank"? That normally directs links to a new tab.

As long as you have flexibility to change these links, I would suggest this format:

CURRENT:

<li>   <a target="_blank" href="javascript:TLSshowhide('adeleboag');">Boag, Adele</a> </li>

EVOLUTION #1:

<li>   <a href="javascript:void(0);" onclick="TLSshowhide('adeleboag');">Boag, Adele</a> </li>

href="javascript:void(0);" kills the link functionality so there's no accidental navigation after the script runs.

But since you have no fallback behavior for the link, you could go to this:

EVOLUTION #2:

<li onclick="TLSshowhide('adeleboag');">Boag, Adele</li>

And to give people the visual cue that it's clickable, this CSS:

.btn-group .dropdown-menu li {   cursor: pointer; }

Read this answer in context 👍 1

כל התגובות (2)

פתרון נבחר

Hi bobj, why do the links have target="_blank"? That normally directs links to a new tab.

As long as you have flexibility to change these links, I would suggest this format:

CURRENT:

<li>   <a target="_blank" href="javascript:TLSshowhide('adeleboag');">Boag, Adele</a> </li>

EVOLUTION #1:

<li>   <a href="javascript:void(0);" onclick="TLSshowhide('adeleboag');">Boag, Adele</a> </li>

href="javascript:void(0);" kills the link functionality so there's no accidental navigation after the script runs.

But since you have no fallback behavior for the link, you could go to this:

EVOLUTION #2:

<li onclick="TLSshowhide('adeleboag');">Boag, Adele</li>

And to give people the visual cue that it's clickable, this CSS:

.btn-group .dropdown-menu li {   cursor: pointer; }

jscher2000, thank you for your reply. The target=_blank was the problem. I can not see why I didn't pick this up, it was based on code I copied from somewhere else but I didn't spot the target property.

Thank you, you have saved my bacon or tofu if you are vegan

bobj