jqueryを使用してテーブル内のtdタグを取得します

まず、私が遭遇した問題を紹介します

1. テーブルに

タグと タグが含まれている場合、次のように考えることができます。 onclick イベントがあるので、「生成」リンクをクリックして QRUrl の タグと LocalUrl の タグをクリックするだけです。 jQuery

のevent function build(sender){ var jqSender = $(sender); ここでは、jsオブジェクトを$()でjqueryオブジェクトに変換し、2つの「+」の間に以下の内容を配置します。 。

var sceneid = jqSender.attr('sceneid'); //attr はオブジェクトの属性の値を見つけることができます

まず td タグを取得する必要があります。どの行にあるかを知る、これは位置決めと同じです。例: 北京には南京一路があり、成都にも南京一路があります。あなたが私にどこにいるかと尋ねると、私は南京一路にいると答えます。私が北京にいるのか成都にいるのかは確かなので、場所を特定する必要があります。たとえば、私たちが成都の南京路一号にいるとします。

ここで特定の行を取得するには eq() を使用するのが最善です。ページのコードを変更する必要がある場合、これは非常に面倒です。たとえば、私の家の場所を覚えておきたい場合、知っておく必要があるのは通りと家の番号だけです。誰かがここに新しい家を追加した場合にのみわかります。 （たとえが少し不適切ですが、コンピュータは非常に厳格です）。

それで、この tr の ID と QRUrl と LocalUrl のクラスを設定します。コードは次のとおりです。

<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="/static/imghwm/default1.png"  data-src="@scene.LocalUrl"  class="lazy"     style="max-width:90%"/ alt="jqueryを使用してテーブル内のtdタグを取得します" >
            }
            else
            {           
                <!--图片为空，生成图片-->
                <a sceneid="@scene.ID" href="#" onclick="build(this);">生成</a>
            }        
        </td>
</tr>

次に、jQuery で次のように見つけることができます:

    <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="/static/imghwm/default1.png"  data-src="@scene.LocalUrl"  class="lazy"     style="max-width:90%"/ alt="jqueryを使用してテーブル内のtdタグを取得します" >
            }
            else
            {          
                <!--图片为空，生成图片-->
                <a sceneid="@scene.ID" href="#" onclick="build(this);">生成</a>
            }        
         </td>
    </tr>

td タグを調べるだけであり、使用されません。

メソッドは次のようになります。要素に「座標」を追加します。なぜそれぞれIDとクラス名なのでしょうか? まず、行がたくさんある場合、それを一意に決定する唯一の方法です。 CSS の管理を容易にするクラスを使用することをお勧めします

注: この記事は参考用であり、多くの小さな欠陥があります。最も重要なことは次のとおりです。コードではなくロジックが最も重要です。

以上がjqueryを使用してテーブル内のtdタグを取得しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。