jquery를 사용하여 테이블에서 td 태그를 가져옵니다.

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

1. 테이블에 <tr> 태그와 <td> 태그가 포함된 경우 대략적으로 다음과 같이 생각할 수 있습니다.

<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. onclick 이벤트가 있습니다. "생성" 링크를 클릭하여 QRUrl의 <td> 태그와 LocalUrl

태그를 클릭하여 클릭하면 됩니다. event in 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('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 태그 단지 알아내는 것이지 사용되지는 않습니다.

방법은 이렇습니다. 요소에 "좌표"를 추가하는 이유는 무엇입니까? 우선 행이 많을 때 ID를 추가하는 것이 유일한 방법입니다. 결정되면 열은 id 또는 class가 될 수 있습니다. CSS

참고: 이 문서는 단지 참조용이며, 가장 중요한 것은 작은 결함이 많다는 것입니다. 코드가 아니라 논리가 가장 중요합니다.

위 내용은 jquery를 사용하여 테이블에서 td 태그를 가져옵니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!