$(this).finden("a").attr("onclick"); onclick Angabe ungültige Zeichen

I m, erstellen eine dynamische tab mit Jquery seine arbeiten fein, aber gibt Fehler für Anker-tag onclick Fehler ist ungültiges Zeichen.
Siehe javascript:

$(document).ready(function(){

    //when page loads...
    $(".tab_content").hide(); //hide all content
    $("ol.tabs li:first").addClass("active").show();  //Activate first tab
    $(".tab_content:first").show(); //show first tab content

    //on click event
    $("ol.tabs li").click(function(){
        $("ol.tabs li").removeClass("active"); //remove any "active" class
        $(this).addClass("active"); //add "active" class to selected tabs
        $(".tab_content").hide(); //hide all tab content
        //var activeTab = $(this).find("a").attr("href"); //find href attribute value to identify the active tab + content
        var activeTab = $(this).find("a").attr("onclick"); //find href attribute value to identify the active tab + content
        $(activeTab).fadeIn(); //fadeIn the active ID content
        alert(activeTab);
        return false;
    });

});

Und HTML:

<div>
    <div id="tab1" class="tab_content">01</div>
    <div id="tab2" class="tab_content">02</div>
    <div id="tab3" class="tab_content">03</div>
</div>
<ol class="tabs">
    <li><a onclick="#tab1">Unique benefits</a></li>
    <li><a onclick="#tab2">Insurance</a></li>
    <li><a onclick="#tab3">Business Loan</a></li>
</ol>

Wenn ich var activeTab = $(this).find("a").attr("href");
Seine Arbeit in Ordnung.
Helfen

warum sind Sie auf der Suche nach der onclick - Attribut? Was versuchen Sie zu erreichen?
Ihre HTML scheint ungültig, Sie haben eine extra </div>. Außerdem haben Sie versucht, jquery ui tabs?
Wenn .attr( "href" ) funktioniert, warum nicht?

InformationsquelleAutor Sagar | 2011-08-18

3

Das ist das erwartete Verhalten.

Weil das Letzte mal ich überprüft, onclick war ein Ereignis und nicht ein Attribut oder eine Eigenschaft.

Auch href und onclick sind völlig verschiedene Dinge.

InformationsquelleAutor naveen

wenn Sie wollen, um den Inhalt(der Funktion) der onclick-dies ist, wie Sie gehen über es:

$('p').click(function () {
            alert($(this).text());
        });

        $.each($("p").data("events"), function (i, event) {
            alert(i);
            $.each(event, function (j, h) {
                alert(h.handler);
            });
        });

InformationsquelleAutor Ali Habibzadeh

Können Sie nicht die onclick von einem element auf einen beliebigen string, dieser wird nicht bedeuten, alles zu javascript. Stattdessen sollten Sie Felder verwenden, wie die href oder data-Attribute, um Informationen zu speichern für den Einsatz in Veranstaltungen.

Verwenden href - Attribut hat, ändern Sie Ihre ol Liste wie folgt Aussehen:

<ol class="tabs">
    <li><a href="#tab1">Unique benefits</a></li>
    <li><a href="#tab2">Insurance</a></li>
    <li><a href="#tab3">Business Loan</a></li>
</ol>

Und dann statt

var activeTab = $(this).find("a").attr("onclick"); //find href attribute value to identify the active tab + content
$(activeTab).fadeIn(); //fadeIn the active ID content

Und verwenden Sie dieses javascript:

var activeTab = $(this).find("a").attr("href");
$(activeTab).fadeIn();

Dies wird mit dem href-Attribut des link, um zu zeigen, das tab mit der entsprechenden ID.

Alternativ, die Verwendung der Daten-Attribute, die Sie setzen können Ihre Liste so:

<ol class="tabs">
    <li><a href="#" data-tabid="tab1">Unique benefits</a></li>
    <li><a href="#" data-tabid="tab2">Insurance</a></li>
    <li><a href="#" data-tabid="tab3">Business Loan</a></li>
</ol>

Und verwenden Sie dieses javascript:

var activeTab = $(this).find("a").data("tabid");
$("#" + activeTab).fadeIn();

Dieser Ansatz verwendet data-Attribute zu halten, wird die ID des tab - <div> Sie zeigen wollen.

InformationsquelleAutor betamax

0

Onclick-Attribut, ist ein event-handler-Attribut ist das gleiche wie das, was Sie tun, in dieser code-Zeile in deinem script:

$("ol.tabs li").klicken Sie auf(

Finden Sie unter: http://reference.sitepoint.com/html/event-attributes/onclick

In anderen Worten sind Sie die Zuordnung der Umgang mit den click event auf ein script mit dem Namen '#tab1'
Der hash-tag ist eine 'illegale' script char.

Zu erreichen, was Sie wollen, es gibt ein paar denkt, dass Sie tun können.
Verwenden Sie zunächst eine Daten-Attribut.
```
<ol class="tabs">
        <li><a data-tab-name="#tab1">Unique benefits</a></li>
        <li><a data-tab-name="#tab2">Insurance</a></li>
        <li><a data-tab-name="#tab3">Business Loan</a></li>
</ol>
```
Und Sie ändern Ihre js-Zeile:
```
var activeTab = $(this).find("a").attr("data-tab-name");
```
Auf ein zugehöriger Hinweis ich ändere ein paar Dinge in deinem script.
Da Sie mit der Befestigung der event-handler onclick-Ereignis der Liste Element I wird das Attribut hinzufügen, um der Liste ein Element wie folgt.
```
<ol class="tabs">
        <li data-tab-name="#tab1"><a>Unique benefits</a></li>
        <li data-tab-name="#tab2"><a>Insurance</a></li>
        <li data-tab-name="#tab3"><a>Business Loan</a></li>
</ol>
```
Mir erlaubt zu cahnge die js-Zeile:
```
var activeTab = $(this).attr("data-tab-name");
```
Was sollte die performance verbessern, ein bisschen, aber wichtiger ist der code besser lesbar.

Hoffe, das hilft.

InformationsquelleAutor theprogrammer
0

Ihrer onclick-inline-Attribut ist äquivalent zu:
```
function() {
    #tab1
}
```
ist kein gültiges javascript. Während href ein string-Wert ist, erzählt der link wo es hin soll, wenn geklickt wird (Standardverhalten), onclick eine javascript-Funktion, die einen handler für das click-Ereignis, um Alternative Verhalten.

InformationsquelleAutor Dennis

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.