Verwenden Sie jquery, um das td-Tag in der Tabelle abzurufen

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="#" onclick="build(this);">生成</a>
            }        
        </td>
</tr>

2. Hier muss ich nur auf den Link „Generieren“ klicken und den Tag finden. td> von LocalUrl. Zuerst klicken wir auf dieses Tag, um das Klickereignis in jQuery

function build(sender){ var jqSender = $(sender); Das js-Objekt wird durch $() geleitet, in ein jquery-Objekt konvertiert und der folgende Inhalt wird zwischen den beiden „+“ platziert.

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

Zuerst muss ich wissen, in welcher Zeile es sich befindet. Dies ist dasselbe wie die Positionierung. 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 weiß nicht, ob ich in Peking oder Chengdu bin, also sollten wir uns zum Beispiel 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="#" onclick="build(this);">生成</a>
            }        
         </td>
    </tr>

<script type="text/javascript">
    function build(sender) {    
        var jqSender = $(sender);   
        var sceneid = jqSender.attr(&#39;sceneid&#39;);        
        //找到指定行类名为wxurl-col的td标签
        $(&#39;tbody tr[sceneid=&#39; + sceneid + &#39;] td.wxurl-col&#39;)        
        //找到指定行类名为localurl-col的td标签
        $(&#39;tbody tr[sceneid=&#39; + sceneid + &#39;] td.localurl-col&#39;)        
        //找到点击事件的a标签        
        jqSender
     }
</script>

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 ein Klassenname sein. Es wird empfohlen, die Klasse zu verwenden, um die Verwaltung unseres CSS zu erleichtern

Hinweis: Dieser Artikel dient als Referenz Nur, und es gibt viele kleine Fehler. Das Wichtigste ist nicht der Code, sondern die Logik.

Das obige ist der detaillierte Inhalt vonVerwenden Sie jquery, um das td-Tag in der Tabelle abzurufen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!