jQuery가 테이블에서 td 태그를 얻는 방법에 대한 자세한 설명

먼저 제가 겪은 문제를 소개하겠습니다

1. a34de1251f0d9fe1e645927f19a896e8 태그와 b6c5a531a458a2e790c1fd6421739d1c 태그가 포함된 테이블이 있으면 대략적으로 다음과 같이 생각할 수 있습니다.

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

2. onclick 이벤트입니다. 제가 해야 할 일은 QRUrl의 b6c5a531a458a2e790c1fd6421739d1c 태그와 LocalUrl

의 b6c5a531a458a2e790c1fd6421739d1c 태그를 찾기 위해 "생성" 링크를 클릭하는 것입니다. 먼저 이 태그를 클릭하여 클릭 이벤트를 실행합니다. jQuery에서

function build(sender){ var jqSender = $(sender); + +} 这里把js对象通过 $()转变成了jquery对象，下面的内容放在两个“+”之间。
var sceneid = jqSender.attr('sceneid'); //attr可以找到对象的属性的值，这里我们找到了sceneid这个属性的值

td 태그를 얻으려면 먼저 그 태그가 어느 행에 있는지 알아야 합니다. 이는 위치 지정과 동일합니다. 예를 들어 베이징에는 난징 1번 도로가 있고, 청두에는 난징 1번 도로가 있습니다. 제가 어디에 있는지 물어보면 난징 1번 도로에 있다고 말할 수 있습니다. 내가 베이징에 있는지 청두에 있는지 확인하려면 청두의 No. 1 Nanjing Road에 있다고 가정해 보겠습니다.

여기에서 특정 행을 가져오려면 eq()를 사용하는 것이 가장 좋습니다. 페이지 코드를 수정해야 하는 경우 이는 매우 번거로운 일입니다. 예를 들어 내 집이 어디에 있는지 기억하고 싶다면 거리와 집 번호만 알면 되는데, 이 거리의 첫 번째 집이 여기에 다른 사람이 새 집을 추가하면 내 집이라는 것만 알 수 있다. (비유는 약간 부적절하지만 컴퓨터는 매우 엄격합니다).

그래서 우리는 이 tr에 대한 ID와 QRUrl 및 LocalUrl에 대한 클래스를 설정했습니다. 코드는 다음과 같습니다.

    <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>

그러면 jQuery에서 다음과 같이 찾을 수 있습니다.

<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>

td 태그는 발견되기만 하고 사용되지는 않습니다. .

이 방법은 요소에 "좌표"를 추가하는 것입니다. 왜 각각 ID와 클래스 이름이 있습니까? 우선 행을 고유하게 식별하는 유일한 방법은 행에 추가하는 것입니다. 열은 id 또는 class일 수 있습니다. CSS 관리를 용이하게 하려면 클래스를 사용하는 것이 좋습니다.

위 내용은 jQuery가 테이블에서 td 태그를 얻는 방법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!