jQuery ruft das TD-Tag in der Tabellentabelle ab

Dieser Artikel enthält hauptsächlich einen Artikel über jQuery zum Abrufen des td-Tags in der Tabelle (Erklärung mit Beispielen). Der Herausgeber findet es ziemlich gut, deshalb teile ich es jetzt mit Ihnen und gebe es als Referenz. Folgen wir dem Herausgeber und schauen wir uns das an. Ich hoffe, es kann allen helfen.

Lassen Sie mich zunächst die Probleme vorstellen, auf die ich gestoßen bin

1. Wenn eine Tabelle -Tags enthält, kann man sich das ungefähr wie folgt vorstellen:

<tr>
    <td>
      @scene.ID
    </td>
    <td>
      @scene.SceneName
    </td>
    <td>
      @scene.QRUrl
    </td>
    <td>
      @scene.LocalUrl
    </td>
    <td>
      <!--如果有图片，展示图片，没有图片生成图片-->
      <!--判断localUrl（本地服务器路径）是否为空，如果为空，表示没有生成，如果不为空表示已经生成-->
      @if (!string.IsNullOrWhiteSpace(scene.LocalUrl))
      {
        <!--图片不为空，展示图片地址-->
        <img src="@scene.LocalUrl" style="width:200px; height:100px"/>
      }
      else
      {
        <!--图片为空，生成图片-->
        <a sceneid="@scene.ID" href="#" rel="external nofollow" rel="external nofollow" onclick="build(this);">生成</a>
      }
    </td>
</tr>

2. Hier muss ich nur auf den Link „Generieren“ klicken und den Tag finden 🎜>

Zuerst klicken wir auf das a-Tag, um das Click-Event in jQuery auszuführen

function build(sender){ var jqSender = $(sender + +} Hier wird das js-Objekt in a umgewandelt jquery-Objekt durch $() , wird der folgende Inhalt zwischen den beiden „+“ platziert.

var sceneid = jqSender.attr('sceneid'); //attr kann den Wert des Attributs sceneid finden

Ich brauche das td tag , zuerst sollte ich wissen, in welcher Zeile es sich befindet, was mit der Positionierung identisch ist. Zum Beispiel: Es gibt eine Nanjing Road Nr. 1 in Peking und eine Nanjing Road Nr. 1 in Chengdu. Sie fragen mich, wo ich bin, und ich sage Ihnen, dass ich in der Nanjing Road Nr. 1 bin Ich bin mir sicher, ob ich in Peking oder Chengdu bin. Wir sollten uns also beispielsweise an der Nanjing Road Nr. 1 in Chengdu befinden.

Es ist am besten, eq() zu verwenden, um hier eine bestimmte Zeile abzurufen. Wenn der Seitencode geändert werden muss, ist dies sehr mühsam. Wenn Sie sich beispielsweise merken möchten, wo sich mein Haus befindet, müssen Sie nur die Straße und die Hausnummer kennen. Sie wissen nur, dass das erste Haus in dieser Straße mein Haus ist nicht das erste Haus sein (Die Analogie ist etwas unangemessen, aber Computer sind so starr).

Also legen wir eine ID für diesen tr und eine Klasse für QRUrl und LocalUrl fest. Der Code lautet wie folgt:

<tr sceneid="@scene.ID">
    <td>
      @scene.ID
    </td>
    <td>
      @scene.SceneName
    </td>
    <td class="wxurl-col">
      @scene.QRUrl
    </td>
    <td class="localurl-col">
      @scene.LocalUrl
    </td>
    <td>
      <!--如果有图片，展示图片，没有图片生成图片-->
      <!--判断localUrl（本地服务器路径）是否为空，如果为空，表示没有生成，如果不为空表示已经生成-->
      @if (!string.IsNullOrWhiteSpace(scene.LocalUrl))
      {
        <!--图片不为空，展示图片地址-->
        <img src="@scene.LocalUrl" style="width:200px; height:100px"/>
      }
      else
      {
        <!--图片为空，生成图片-->
        <a sceneid="@scene.ID" href="#" rel="external nofollow" rel="external nofollow" onclick="build(this);">生成</a>
      }
    </td>
  </tr>

Dann können Sie ihn in jQuery wie folgt finden:

<script type="text/javascript">
  function build(sender) {
    var jqSender = $(sender);
    var sceneid = jqSender.attr('sceneid');

    //找到指定行类名为wxurl-col的td标签
    $('tbody tr[sceneid=' + sceneid + '] td.wxurl-col')

    //找到指定行类名为localurl-col的td标签
    $('tbody tr[sceneid=' + sceneid + '] td.localurl-col')

    //找到点击事件的a标签
    jqSender

}
</script>

td-Tag wurde gerade gefunden, aber nicht verwendet.

Die Methode ist wie folgt: Fügen Sie dem Element „Koordinaten“ hinzu. Warum sind es jeweils ID und Klassenname? Erstens gibt es viele Zeilen. Die einzige Möglichkeit, es eindeutig zu bestimmen, besteht darin, ID hinzuzufügen. Wenn die Zeile bestimmt ist, kann die Spalte entweder eine ID oder eine Klasse sein. Es wird empfohlen, die Klasse zu verwenden, um die Verwaltung unseres CSS zu erleichtern.

Hinweis: Dieser Aufsatz dient nur als Referenz und weist viele kleine Fehler auf. Das Wichtigste ist nicht der Code, sondern die Logik.

Verwandte Empfehlungen:

Detaillierte Erläuterung der jQuery-Implementierung, um die Zeilennummer und Spaltennummer der Mausklickposition in der Tabelle zu erhalten

So erhalten Sie die Tabelle in JavaScript. Den Wert einer bestimmten Spalte

Implementierungscode für die Verwendung von jQuery zum Abrufen der Zeilen-ID und des td-Werts in der table_jquery

Das obige ist der detaillierte Inhalt vonjQuery ruft das TD-Tag in der Tabellentabelle ab. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!